/**
 * @description Openlayers全局工具封装
 */
import MapConfig from '@/utils/map/MapConfig'
import axios from 'axios'
import { getDwInfo, getGwGisInfo, getNumByQySx } from '@/api/home'
import $ from 'jquery'
import sheng_bj from '@/utils/sheng'
import haian_bj from '@/utils/haian'
import { useClearMap } from '@/hooks'
import { _setHoverContent, _setHoverData } from '@/utils/map/pointHoverData'
import { getIconByData } from '@/utils/map/generatePointImages'
import { fanhuijwd, fanhuiMapCenter } from '@/utils/map/areaCoordinate'

window.hl_xiazai = hl_xiazai
window.hl_yulan = hl_yulan
var xuanze = ''
var mingzi = ''
var xmaps = null
var stationActive = 0
var DBSType = 'dbs'
var wryjhzhi = 0
var popupContent = null
var popups = null
var glContent = null
var glpup = null
var selectionhlLayer = null
var selectionmLayer = null
var selectionqyLayer = null
var selectionsxLayer = null
var selection = {}
var selecmtion = {}
var selecqytion = {}
var selecsxtion = {}// 河流
var hltuceng = null
var hlmtuceng = null
var zhujituceng = null
var quyutuceng = null
var shuixituceng = null
var hlstuceng = null
var xijietuceng = null
var yintuceng = null
var shituceng = null
var pointtuceng = null
var wrypointlisttuceng = [] // 聚合放大图层 , 聚合图层, 正常点位图层
var yao1tuceng = null
var yao2tuceng = null
var hctuceng = null
var dxtuceng = null
var bengzhans = null
var beng_tc = null
var bianjie = []
var qyname = ''
var sxname = ''
var zhongxin = []
var highlightXzqh = []
var maodianlist = []
var haiyangtu1 = null
var haiyangtu2 = null
var haiyangtu3 = null
var haiyangtu4 = null
var haiyangtu5 = null
var haiyangtu6 = null
var haiyangtu7 = null
var fangtuceng = null
var xhqytuceng = null
var gcqytuceng = null
var wqzhuji_wq = null
var wqzhuji_ds = null
var haitu1 = null
var haitu2 = null
var bdhxiantuceng = null
var highlightLayer = null
var ru_hai1 = null
var ru_hais1 = null
var ru_haiss1 = null
var ru_hai2 = null
var ru_hai3 = null
var ru_hai4 = null
var ru_hai5 = null
var ru_hai6 = null
var ru_yu1 = null
var ru_yus1 = null
var ru_yu2 = null
var ru_yus2 = null
var ru_yu3 = null
var ru_yu4 = null
var ru_yu5 = null
var ru_yus5 = null
var ru_yu6 = null
var ru_yu_6 = null
var ru_yu7 = null
var ru_yus7 = null
var ru1_Listener, ru2_Listener, rus2_Listener, ru3_Listener, rus4_Listener, rus5_Listener, rus5s_Listener,
  rus6_Listener, guan_Listener
var dstuceng = null
var dsselections = null
var shengtuceng = null
var dsbjxname = ''
var leinames = 'bdh'
var shitucengListener, pointListListener, heliuListener, heliueListener, heliusListener, xuanfuListener,
  zhengtiListener, quyuListener, shuixiListener
var showPointZoom = 8 // 地图显示点位的级别
var eshuju = null
var dianListener1 = false
var dianListener2 = false
var dianListener3 = false
/* 地图*/
const img = require('@/assets/svg/map.svg')

/**
 * 添加天地图底图
 * @param {object} map 地图对象
 */
export function initTDTLayer(map, type, lei, thiss) {
  eshuju = thiss
  selectionhlLayer = null
  selectionmLayer = null
  selectionqyLayer = null
  selectionsxLayer = null
  selection = {}
  selecmtion = {}
  selecqytion = {}
  selecsxtion = {}
  hltuceng = null
  hlstuceng = null
  hctuceng = null
  hlmtuceng = null
  zhujituceng = null
  bianjie = []
  quyutuceng = null
  shuixituceng = null
  yao1tuceng = null
  yao2tuceng = null
  dxtuceng = null
  bengzhans = null
  haiyangtu1 = null
  haiyangtu2 = null
  haiyangtu3 = null
  haiyangtu4 = null
  haiyangtu5 = null
  haiyangtu6 = null
  haiyangtu7 = null
  wqzhuji_wq = null// 湾区注记
  wqzhuji_ds = null
  haitu1 = null
  haitu2 = null
  ru_yu1 = null
  ru_yus1 = null // 历年赤潮（水色异常）
  ru_yu2 = null
  ru_yus2 = null
  ru_yu3 = null
  ru_yu4 = null // 历年溢油污染事故点
  ru_yu5 = null
  ru_yus5 = null
  ru_yu6 = null
  ru_yu_6 = null
  ru_yu7 = null
  ru_yus7 = null // 赤潮削减图层
  ru_hai1 = null
  ru_hais1 = null
  // ---------------------------------------------- 入海河流 --------------------------------
  ru_haiss1 = null // 污水管网流向 图层状态
  ru_hai2 = null
  ru_hai3 = null
  ru_hai4 = null
  ru_hai5 = null
  ru_hai6 = null
  fangtuceng = null
  gcqytuceng = null
  xhqytuceng = null
  bdhxiantuceng = null
  highlightLayer = null
  leinames = 'bdh'
  xuanze = ''
  mingzi = ''
  xmaps = map
  addqitan(map)
  initwaterlk(map)// 河流
  // initfenzhi1(map)//河流
  // initfenzhi2(map)//湖库
  if (lei != undefined && lei == 'zhengti') {
    // initguanwang(true)
    inityaoganlk(map)// 遥感
    initdixinglk(map)// 地形
    loadWFS(map) // WFS 图层
    loadRHHL(map) // 入海河流图层
    addzhengfang(map)
    // addhaianxian(map)
    xhqyTu(map)
    gcqyTu(map)
    bjshengcl(map)// 省边界线
    bjdishicl(map)// 地市边界线
    // initquyu(map)
    // initshuixi(map)
  }
  // 监测地图zoom改变
  // 清除监听
  if (zhengtiListener) {
    ol.Observable.unByKey(zhengtiListener)
  }
  map.on('singleclick', function(e) {
    var lonlat = map.getCoordinateFromPixel(e.pixel)
    console.log(lonlat)
    var zoom = map.getView().getZoom()
    console.log('zoom:' + zoom)
    var center = map.getView().getCenter()
    console.log('center:' + center)
  })
  zhengtiListener = map.getView().on('change:resolution', function(e) {
    var zoom = map.getView().getZoom()
    // 是否是有聚合的地图
    if (stationActive == 2 || stationActive == 3 || stationActive == 7) {
      if (stationActive == 3 && wryjhzhi != 3) {
        return
      }
      if (map != null) {
        if (zoom >= showPointZoom) {
          if (yintuceng != null) {
            yintuceng.setVisible(true)
          }
          if (shituceng != null) {
            shituceng.setVisible(false)
          }
        } else {
          if (yintuceng != null) {
            yintuceng.setVisible(false)
          }
          if (shituceng != null) {
            shituceng.setVisible(true)
          }
        }
      }
    }
  })
}

/* 气泡弹框*/
export function addqitan(map) {
  // 弹框
  popupContent = document.getElementById('popup-content')
  popups = new ol.Overlay(({
    id: 'pop', element: document.getElementById('popup'), autoPan: true, autoPanAnimation: {
      duration: 250
    }
  }))
  popups.setPosition(undefined)
  map.addOverlay(popups)
  // 高亮
  glContent = document.getElementById('dianpup-content')
  glpup = new ol.Overlay(({
    id: 'gldian', element: document.getElementById('dianpup'), autoPan: true, autoPanAnimation: {
      duration: 250
    }
  }))
  glpup.setPosition(undefined)
  map.addOverlay(glpup)
}

// 黑臭水体
export function initheichou(map, thiss, twenben) {
  var vectorSource = new ol.source.Vector()
  hctuceng = new ol.layer.Vector({
    source: vectorSource, style: new ol.style.Style({
      stroke: new ol.style.Stroke({
        color: 'rgba(255,0,0,1)', width: 2
      }), fill: new ol.style.Fill({
        color: 'rgba(255,0,0,1)'
      })
    })
  })
  const url = 'http://10.122.2.138:8090/iserver/services/data-shapefile-shp/wfs100/utf-8?service=WFS&version=1.1.0&request=GetFeature&typename=hcst:hcst&outputFormat=gml2&srsname=EPSG:4326'
  axios.get(url).then(res => {
    var features = new ol.format.GML2().readFeatures(res.data, {
      featureProjection: map.getView().getProjection()
    })
    // console.log(features)
    var dianwei = []
    var txt1 = 0
    var txt2 = 0
    var lei = '0'
    if (thiss.hcstMapCheckList.includes('市级') && thiss.hcstMapCheckList.includes('区县')) {
      lei = '0'
    } else if (thiss.hcstMapCheckList.includes('市级')) {
      lei = '1'
    } else if (thiss.hcstMapCheckList.includes('区县')) {
      lei = '2'
    } else {
      lei = '3'
    }
    thiss.hcst.forEach(item => {
      item.num = 0
    })
    thiss.sjhcst.forEach(item => {
      item.num = 0
    })
    thiss.xjhcst.forEach(item => {
      item.num = 0
    })
    if (features.length != 0) {
      for (var i = 0; i < features.length; i++) {
        var sj = features[i].values_
        var zhi = {
          // "id":sj['id'],
          '区县': sj['区县'],
          '地市': sj['地市'], // "序号":sj['序号'],
          '数据时间': sj['数据时'],
          '水体类别': sj['水体类'],
          '管控级别': sj['管控级'],
          '终点纬度': sj['终点纬'],
          '终点经度': sj['终点经'],
          '起点纬度': sj['起点纬'],
          '起点经度': sj['起点经'],
          'lat': sj['the_geom']['flatCoordinates'][0],
          'lon': sj['the_geom']['flatCoordinates'][1],
          '黑臭段起点': sj['黑臭段'],
          '黑臭段终点': sj['黑臭段_'],
          '黑臭水体编号': sj['黑臭水'],
          '黑臭水体名称': sj['黑臭水_']
        }
        if (zhi['管控级别'] == '县区') {
          txt2++
        } else if (zhi['管控级别'] == '地市') {
          txt1++
        }
        if (lei == '0') {
          thiss.hcst.forEach(item => {
            if (item.city.includes(zhi['地市'])) {
              item.num++
            }
          })
          if (thiss.DBSActiveCity != '') {
            if (thiss.DBSActiveCity.includes(zhi['地市'])) {
              if (twenben != '') {
                if (twenben == zhi['水体类别']) {
                  dianwei.push(zhi)
                }
              } else {
                dianwei.push(zhi)
              }
            }
          } else {
            if (twenben != '') {
              if (twenben == zhi['水体类别']) {
                dianwei.push(zhi)
              }
            } else {
              dianwei.push(zhi)
            }
          }
        } else if (lei == '1') {
          if (zhi['管控级别'] == '地市') {
            thiss.sjhcst.forEach(item => {
              if (item.city.includes(zhi['地市'])) {
                item.num++
              }
            })
          }
          if (zhi['管控级别'] == '地市') {
            if (thiss.DBSActiveCity != '') {
              if (thiss.DBSActiveCity.includes(zhi['地市'])) {
                if (twenben != '') {
                  if (twenben == zhi['水体类别']) {
                    dianwei.push(zhi)
                  }
                } else {
                  dianwei.push(zhi)
                }
              }
            } else {
              if (twenben != '') {
                if (twenben == zhi['水体类别']) {
                  dianwei.push(zhi)
                }
              } else {
                dianwei.push(zhi)
              }
            }
          }
        } else if (lei == '2') {
          if (zhi['管控级别'] == '县区') {
            thiss.xjhcst.forEach(item => {
              if (item.city.includes(zhi['地市'])) {
                item.num++
              }
            })
          }
          if (zhi['管控级别'] == '县区') {
            if (thiss.DBSActiveCity != '') {
              if (thiss.DBSActiveCity.includes(zhi['地市'])) {
                if (twenben != '') {
                  if (twenben == zhi['水体类别']) {
                    dianwei.push(zhi)
                  }
                } else {
                  dianwei.push(zhi)
                }
              }
            } else {
              if (twenben != '') {
                if (twenben == zhi['水体类别']) {
                  dianwei.push(zhi)
                }
              } else {
                dianwei.push(zhi)
              }
            }
          }
        }
      }
    }
    thiss.wryMapzhi.hcshi = txt1
    thiss.wryMapzhi.hcxian = txt2
    var lists = []
    if (lei == '0') {
      lists = thiss.hcst
    } else if (lei == '1') {
      lists = thiss.sjhcst
    } else if (lei == '2') {
      lists = thiss.xjhcst
    } else {
      lists = []
    }
    thiss.hcstList.list = lists
    addPoint(map, dianwei, 'hcst')
  })
}

export function inithcshan(map) {
  if (hctuceng != null) {
    hctuceng.setVisible(false)
  }
}

// 导出fangtuceng
export { fangtuceng }

/* 正方形*/
export function addzhengfang(map) {
  if (fangtuceng == null) {
    const features = []
    const datas = [[119.02, 40.11], [120.27, 40.11], [120.27, 39.34], [119.02, 39.34], [119.02, 40.11]]
    var feature = new ol.Feature({
      type: 'Polygon', geometry: new ol.geom.Polygon([datas])
    })
    const lineStyle = new ol.style.Style({
      stroke: new ol.style.Stroke({
        color: 'red', width: 1, lineDash: [5, 5]
      })
    })
    feature.setStyle(lineStyle)
    features.push(feature)
    fangtuceng = new ol.layer.Vector({
      zIndex: 5, source: new ol.source.Vector({ features })
    })
    map.addLayer(fangtuceng)
    fangtuceng.setVisible(false)
  }
}

/* 北戴河海岸线*/
export function addhaianxian(map) {
  if (bdhxiantuceng == null) {
    const features = []
    const datas = []
    var data = haian_bj.features[0].geometry.coordinates
    for (var i = 0; i < data.length; i++) {
      for (var m = 0; m < data[i].length; m++) {
        datas.push(data[i][m])
      }
    }
    var feature = new ol.Feature({
      type: 'Polygon', geometry: new ol.geom.LineString(datas)
    })
    const lineStyle = new ol.style.Style({
      stroke: new ol.style.Stroke({
        color: '#00B7EF', width: 5
      })
    })
    feature.setStyle(lineStyle)
    features.push(feature)
    bdhxiantuceng = new ol.layer.Vector({
      zIndex: 5, source: new ol.source.Vector({ features })
    })
    map.addLayer(bdhxiantuceng)
    bdhxiantuceng.setVisible(false)
  }
}

// 港池区域绘制
export { gcqytuceng }

/**
 * 在地图上创建一个多边形特征
 * 这个多边形的坐标由 haian_bj.features[0].geometry.coordinates 提供
 * 并且这个特征默认是不可见的。
 * @param map
 */
export function gcqyTu(map) {
  if (gcqytuceng == null) {
    const features = []
    // let datas=[
    //   [119.57,39.91],[119.57,39.89],[119.58,39.90],[119.58,39.91],[119.59,39.91],[119.59,39.90],[119.60,39.91],[119.60,39.91],[119.61,39.91],[119.62,39.92],[119.62,39.92],[119.62,39.91],[119.62,39.92],[119.62,39.93],[119.63,39.92],[119.63,39.92],[119.64,39.92],[119.64,39.93],[119.65,39.93],[119.65,39.94],[119.66,39.93],[119.66,39.94],[119.66,39.93],[119.67,39.93],[119.67,39.93],[119.67,39.93],[119.68,39.93],[119.68,39.93],[119.68,39.94],[119.69,39.93],[119.69,39.94],[119.70,39.93],[119.70,39.93],[119.70,39.94],[119.70,39.93],[119.71,39.93],[119.71,39.93]
    // ]
    const datas = []
    var data = haian_bj.features[0].geometry.coordinates
    for (var i = 0; i < data.length; i++) {
      for (var m = 0; m < data[i].length; m++) {
        datas.push(data[i][m])
      }
    }
    var feature = new ol.Feature({
      type: 'Polygon', geometry: new ol.geom.LineString(datas)
    })
    const lineStyle = new ol.style.Style({
      stroke: new ol.style.Stroke({
        color: '#00B7EF', width: 5
      })
    })
    // feature.setStyle(lineStyle);
    features.push(feature)
    gcqytuceng = new ol.layer.Vector({
      zIndex: 5, source: new ol.source.Vector({ features })
      // style: function (feature) {
      //   const geometry = feature.getGeometry();
      //   const styles = [
      //     // linestring
      //     new ol.style.Style({
      //       stroke: ol.style.Stroke({
      //         color: '#ffcc33',
      //         width: 2,
      //       }),
      //     }),
      //   ];
      //   geometry.forEachSegment(function (start, end) {
      //     const dx = end[0] - start[0];
      //     const dy = end[1] - start[1];
      //     const rotation = Math.atan2(dy, dx);
      //     // arrows
      //     styles.push(
      //       new ol.style.Style({
      //         geometry: new ol.geom.Point(end),
      //         image: new ol.style.Icon({
      //           src: 'https://openlayers.org/en/latest/examples/data/arrow.png',
      //           anchor: [0.75, 0.5],
      //           rotateWithView: true,
      //           rotation: -rotation,
      //         }),
      //       })
      //     );
      //   });
      //   return styles;
      // }
    })
    map.addLayer(gcqytuceng)
    gcqytuceng.setVisible(true)
  }
}

// 巡航区域绘制
// [119.43, 39.75], [119.59, 39.75], [119.59, 39.70], [119.60, 39.77], [119.60, 39.83], [119.63, 39.83], [119.63, 39.76] [119.62, 39.72], [119.60, 39.70], [119.48, 39.70]
export { xhqytuceng }

export function xhqyTu(map) {
  if (xhqytuceng == null) {
    const features = []
    const datas = [[119.43, 39.75], [119.59, 39.75], [119.60, 39.75], [119.60, 39.77], [119.60, 39.83], [119.63, 39.83], [119.63, 39.76], [119.62, 39.72], [119.60, 39.70], [119.48, 39.70]]
    var feature = new ol.Feature({
      type: 'Polygon', geometry: new ol.geom.Polygon([datas])
    })
    const lineStyle = new ol.style.Style({
      stroke: new ol.style.Stroke({
        color: '#cddbfe', width: 1, lineDash: [5, 5]
      }), fill: new ol.style.Fill({
        color: '#cddbfe'
      })
    })
    feature.setStyle(lineStyle)
    features.push(feature)
    xhqytuceng = new ol.layer.Vector({
      zIndex: 5, source: new ol.source.Vector({ features })
    })
    map.addLayer(xhqytuceng)
    xhqytuceng.setVisible(false)
  }
}

/* 省边界线*/
export function bjshengcl(map) {
  if (shengtuceng == null) {
    var url = 'http://10.122.2.138:8090/iserver/services/map-mvt-DiShixzbjDSDL/restjsr/v1/vectortile/maps/%E5%9C%B0%E5%B8%82@xzbjDS_DL/style.json'
    var format = new ol.format.MVT({
      featureClass: ol.Feature // 处理OpenLayers中的矢量图层
    })
    shengtuceng = new ol.layer.VectorTile({
      zIndex: 3, declutter: true, source: new ol.source.VectorTileSuperMapRest({
        style: url, projection: 'EPSG:4326', source: '地市@xzbjDS_DL', format: format, resolutions: getLods()[0]
      }), style: function(feature) {
        const res = feature.getProperties()
        var name = feature.get('STRUCT_SHO')
        if (name == '邯郸市' || name == '邢台市' || name == '衡水市' || name == '沧州市' || name == '承德市' || name == '唐山市' || name == '秦皇岛市') {
          return new ol.style.Style({
            stroke: new ol.style.Stroke({
              color: '#000000', width: 3
            })
          })
        }
      }
    })
    map.addLayer(shengtuceng)
    // shengtuceng.setVisible(false)
  }
}

/* 地市边界线*/
export function bjdishicl(map) {
  if (dstuceng == null) {
    var url = 'http://10.122.2.138:8090/iserver/services/map-mvt-QXhy/restjsr/v1/vectortile/maps/QX_hy/style.json'
    var format = new ol.format.MVT({
      featureClass: ol.Feature
    })
    var style = new ol.supermap.MapboxStyles({
      style: url, map: map
    })
    style.on('styleloaded', function() {
      dstuceng = new ol.layer.VectorTile({
        zIndex: 3, declutter: true, source: new ol.source.VectorTileSuperMapRest({
          style: url, projection: 'EPSG:4326', source: 'QX_hy', format: format, resolutions: getLods()[0]
        }), style: style.getStyleFunction()
      })
      map.addLayer(dstuceng)
      dstuceng.setVisible(false)
      // dsselections = new ol.layer.VectorTile({
      //   zIndex: 3,
      //   map: map,
      //   renderMode: 'vector',
      //   source: dstuceng.getSource(),
      //   style: function (feature) {
      //     const res=feature.getProperties()
      //     var mc=feature.get('STRUCT_SHO')
      //     if(dsbjxname!=''&&mc==dsbjxname){
      //       return new ol.style.Style({
      //         stroke: new ol.style.Stroke({
      //           color: 'rgba(255,255,240,1)',
      //           width: 3
      //         })
      //       })
      //     }
      //   }
      // });
      // dsselections.setVisible(false)
    })
  }
}

/* 遥感*/
export function inityaoganlk(map) {
  var urls1 = 'http://10.122.2.138:8090/iserver/services/map-agscache-HuanBaoXinXiZhongXinHeBeiShengYingXiang1120/rest/maps/环保信息中心_河北省影像1120'
  var urls2 = 'http://10.122.2.138:8090/iserver/services/map-agscache-JJYX/rest/maps/JJYX'
  if (yao1tuceng == null) {
    yao1tuceng = new ol.layer.Tile({
      zIndex: 2, source: new ol.source.TileSuperMapRest({
        url: urls1, wrapX: true, tileGrid: new ol.tilegrid.WMTS({
          tileSize: [256, 256],
          origin: [112.44969461798416, 45.2271344952415],
          extent: [112.44969461798416, 33.96450384429676, 123.71232526892891, 45.2271344952415],
          resolutions: getLods()[0],
          matrixIds: getLods()[1]
        })
      }), projection: 'EPSG:4326'
    })
    map.addLayer(yao1tuceng)
    yao1tuceng.setVisible(false)
  }
  if (yao2tuceng == null) {
    yao2tuceng = new ol.layer.Tile({
      zIndex: 2, source: new ol.source.TileSuperMapRest({
        url: urls2, wrapX: true, tileGrid: new ol.tilegrid.WMTS({
          tileSize: [256, 256],
          origin: [115.26535228072032, 41.00364800113721],
          extent: [115.26535228072032, 38.18799033840105, 118.08100994345659, 41.00364800113721],
          resolutions: getLods()[0],
          matrixIds: getLods()[1]
        })
      }), projection: 'EPSG:4326'
    })
    map.addLayer(yao2tuceng)
    yao2tuceng.setVisible(false)
  }
}

/* 地形*/
export function initdixinglk(map) {
  var urls = 'http://10.122.2.138:8090/iserver/services/map-agscache-DiXingDiMao/rest/maps/地形地貌'
  if (dxtuceng == null) {
    dxtuceng = new ol.layer.Tile({
      zIndex: 2, source: new ol.source.TileSuperMapRest({
        url: urls, wrapX: true, tileGrid: new ol.tilegrid.WMTS({
          tileSize: [256, 256],
          origin: [61.76693971538111, 62.12175142776971],
          extent: [61.76693971538111, -5.453898286676349, 163.13041428705014, 62.12175142776971],
          resolutions: getLods()[0],
          matrixIds: getLods()[1]
        })
      }), projection: 'EPSG:4326'
    })
    map.addLayer(dxtuceng)
    dxtuceng.setVisible(false)
  }
}

export function liuyuyanse(zhi) {
  switch (zhi) {
    case '内蒙古高原内流区':
      return 'rgba(168,168,0,1.00)'
      break
    case '北三河水系':
      return 'rgba(255,127,127,1.00)'
      break
    case '大清河水系':
      return 'rgba(0,169,230,1.00)'
      break
    case '子牙河水系':
      return 'rgba(75,176,51,1.00)'
      break
    case '永定河水系':
      return 'rgba(255,255,115,1.00)'
      break
    case '滦河及冀东沿海诸河水系':
      return 'rgba(115,235,223,1.00)'
      break
    case '漳卫河水系':
      return 'rgba(0,115,76,1.00)'
      break
    case '黑龙港及远东地区诸河水系':
      return 'rgba(223,115,255,1.00)'
      break
    case '辽河水系':
      return 'rgba(11,0,168,1.00)'
      break
    case '黄河':
      return 'rgba(115,235,223,1.00)'
      break
    case '徙骇马颊河水系':
      return 'rgba(115,235,223,1.00)'
      break
    case '海河':
      return 'rgba(255,170,0,1.00)'
      break
    default:
      return 'rgba(115,235,223,1.00)'
      break
  }
}

export function loadWFS(map) {
  // return
  var dizhi = 'http://10.122.2.138:8090/iserver/services/data-HaiYangBaoHu/wfs100/utf-8?service=WFS&version=1.0.0&request=GetFeature&typename=海洋保护:'
  var urls1 = dizhi + '海洋倾倒区' + '&outputFormat=gml2&srsname=EPSG:4326'// 海洋倾倒区
  var urls2 = dizhi + '海洋生态红线' + '&outputFormat=gml2&srsname=EPSG:4326'// 海洋生态红线
  var urls3 = dizhi + '石油勘探开发设施' + '&outputFormat=gml2&srsname=EPSG:4326'// 石油勘探开发设施
  var urls4 = dizhi + '自然保护地' + '&outputFormat=gml2&srsname=EPSG:4326'// 自然保护地
  var urls5 = 'http://10.122.2.138:8090/iserver/services/data-WanQuHuaFen/wfs100/utf-8?service=WFS&version=1.0.0&request=GetFeature&typename=湾区划分:湾区划分1&outputFormat=gml2&srsname=EPSG:4326'// 湾区划分
  // ------------------------------新增-------------------------------------
  var urls6 = 'http://10.122.2.138:8090/iserver/services/data-WanQuHuaFen/wfs100/utf-8?service=WFS&version=1.0.0&request=GetFeature&typename=湾区划分:湾区划分3&outputFormat=gml2&srsname=EPSG:4326'
  var urls7 = 'http://10.122.2.138:8090/iserver/services/data-WanQuHuaFen/wfs100/utf-8?service=WFS&version=1.0.0&request=GetFeature&typename=湾区划分:湾区划分2_秦皇岛湾北戴河段部分&outputFormat=gml2&srsname=EPSG:4326'// 秦皇岛湾
  var urls8 = 'http://10.122.2.138:8090/iserver/services/data-WanQuHuaFen/wfs100/utf-8?service=WFS&version=1.0.0&request=GetFeature&typename=湾区划分:湾区划分2_唐山湾部分&outputFormat=gml2&srsname=EPSG:4326'// 唐山湾

  // -------------------------------------------------------------------------
  loadxingshi(map, 1, urls1, '海洋倾倒区')
  loadxingshi(map, 2, urls2, '海洋生态红线')
  loadxingshi(map, 3, urls3, '石油勘探开发设施')
  loadxingshi(map, 4, urls4, '自然保护地')
  // loadxingshi(map,5, urls5, '湾区划分')//按照湾区
  // ------------------------------新增-------------------------------------
  loadxingshi(map, 6, urls5, '湾区划分')// 按照时序

  loadxingshi(map, 7, urls6, '湾区划分')// 无色的

  loadxingshi(map, 8, urls7, '湾区划分')// 秦皇岛
  loadxingshi(map, 9, urls8, '湾区划分')// 唐山
}

export function loadRHHL(map) {
  var ddizhi = 'http://10.122.2.138:8090/iserver/services/data-QHDXXQ/wfs100/utf-8?service=WFS&version=1.0.0&request=GetFeature&typename=QHDXXQ:'
  var dizhi = 'http://10.122.2.138:8090/iserver/services/data-QHDFXY/wfs100/utf-8?service=WFS&version=1.0.0&request=GetFeature&typename=QHDFXY:'
  var dizhi1 = 'http://10.122.2.138:8090/iserver/services/data-CCSSYC/wfs100/utf-8?service=WFS&version=1.0.0&request=GetFeature&typename=CCSSYC:'
  var urls1 = ddizhi + '污水流向' + '&outputFormat=gml2&srsname=EPSG:4326'// 污水流向
  var urls1_ = ddizhi + '污水管道' + '&outputFormat=gml2&srsname=EPSG:4326'// 污水管道
  var urls2 = ddizhi + '收水范围' + '&outputFormat=gml2&srsname=EPSG:4326'// 收水范围
  var urls3 = ''
  var urls4 = dizhi + '秦皇岛市涉海风险源排口' + '&outputFormat=gml2&srsname=EPSG:4326'// 涉海风险源厂区排口
  var urls5 = dizhi + '秦皇岛市涉海风险源厂区范围' + '&outputFormat=gml2&srsname=EPSG:4326'// 涉海风险源厂区范围
  var urls6 = dizhi + '秦皇岛市生态保护红线' + '&outputFormat=gml2&srsname=EPSG:4326'// 秦皇岛市生态保护红线

  var urlsb = ddizhi + '污水泵站点' + '&outputFormat=gml2&srsname=EPSG:4326'// 秦皇岛市生态保护红线

  var urls7 = dizhi1 + 'T2022_2023全部_合并' + '&outputFormat=gml2&srsname=EPSG:4326'// 赤潮
  // var urls7_1=dizhi1+"T2022年全部"+'&outputFormat=gml2&srsname=EPSG:4326'//赤潮
  // var urls7_2=dizhi1+"T2023年全部"+'&outputFormat=gml2&srsname=EPSG:4326'//赤潮
  var urls8 = ddizhi + '水母拦截导流网' + '&outputFormat=gml2&srsname=EPSG:4326'// 水母
  var urls8_ = ddizhi + '水母拦截导流网_船点位' + '&outputFormat=gml2&srsname=EPSG:4326'// 水母
  var urls9 = ddizhi + '大型藻类多发区域' + '&outputFormat=gml2&srsname=EPSG:4326'// 藻类
  var urls10 = ''// 溢油
  var urls11 = ddizhi + '沉潜油点位' + '&outputFormat=gml2&srsname=EPSG:4326'// 沉潜点位
  var urls11_ = ddizhi + '沉潜油围控网连线' + '&outputFormat=gml2&srsname=EPSG:4326'// 沉潜连线
  var urls12 = ddizhi + '锚地点' + '&outputFormat=gml2&srsname=EPSG:4326'// 锚地点
  var urls12_ = ddizhi + '锚地面' + '&outputFormat=gml2&srsname=EPSG:4326'// 锚地面
  var urls13 = dizhi1 + 'T2022年和2023年作业区域叠加图' + '&outputFormat=gml2&srsname=EPSG:4326'// 赤潮削减

  // ------------------------------------------- 入海河流 入海河流水质 图层 -------------------------------------------------
  loadruhai(map, 1, urls1, '污水流向')
  loadruhai(map, 2, urls2, '收水范围')
  loadruhai(map, 3, urls3, '管网问题点位')
  loadruhai(map, 4, urls4, '涉海风险源厂区排口')
  loadruhai(map, 5, urls5, '涉海风险源厂区范围')
  loadruhai(map, 6, urls6, '秦皇岛市生态保护红线')
  loadruhai(map, 19, urls1_, '污水管道')

  loadruhai(map, 110, urlsb, '污水泵站点')

  loadruhai(map, 8, urls8, '水母')
  loadruhai(map, 81, urls8_, '水母点')
  loadruhai(map, 9, urls9, '藻类')
  loadruhai(map, 10, urls10, '溢油')
  loadruhai(map, 11, urls11, '沉潜点位')
  loadruhai(map, 111, urls11_, '沉潜连线')
  loadruhai(map, 12, urls12, '锚地点')
  loadruhai(map, 121, urls12_, '锚地面')
  loadruhai(map, 7, urls7, '赤潮')
  loadruhai(map, 13, urls13, '赤潮削减')
}

export function loadruhai(map, leis, urls, leixing) {
  if (leis == 7) {
    if (ru_yus1 == null) {
      // 创建地图图层 Tile图层通常用于展示瓦片地图
      ru_yus1 = new ol.layer.Tile({
        // 设置图层的堆叠顺序。数字越大，图层越在上面。
        zIndex: 4, // 设置图层的数据源
        source: new ol.source.TileSuperMapRest({
          url: 'http://10.122.2.138:8090/iserver/services/map-CCSSYC/rest/maps/T2022年_2023年', //  指定地图瓦片的URL
          wrapX: true, // 是否在X轴方向上循环地图瓦片。
          tileGrid: new ol.tilegrid.WMTS({ // 定义瓦片的网格结构
            tileSize: [256, 256], // 瓦片的大小
            origin: [116.67318111208851, 41.00364800113721], // 瓦片的原点坐标
            extent: [116.67318111208851, 38.18799033840105, 120.89666760619275, 41.00364800113721], // 地图的范围
            resolutions: getLods()[0], // 分辨率数组，定义了不同缩放级别下的地图瓦片分辨率
            matrixIds: getLods()[1] // 与`resolutions`对应的矩阵ID数组。
          })
        }), projection: 'EPSG:4326' // 设置图层的坐标系。EPSG:4326是一个常用的地理坐标系，也称为WGS 84
      })
      map.addLayer(ru_yus1) // 将新创建的ru_yus1图层添加到地图map上。
      ru_yus1.setVisible(false) // 初始化的时候设置为隐藏 = 后续通过开关打开 ru_yus1.setVisible(true)
    }
  }
  if (leis == 13) {
    if (ru_yus7 == null) {
      ru_yus7 = new ol.layer.Tile({
        zIndex: 4, source: new ol.source.TileSuperMapRest({
          url: 'http://10.122.2.138:8090/iserver/services/map-CCSSYC/rest/maps/赤潮削减',
          wrapX: true,
          tileGrid: new ol.tilegrid.WMTS({
            tileSize: [256, 256],
            origin: [116.67318111208851, 41.00364800113721],
            extent: [116.67318111208851, 38.18799033840105, 120.89666760619275, 41.00364800113721],
            resolutions: getLods()[0],
            matrixIds: getLods()[1]
          })
        }), projection: 'EPSG:4326'
      })
      map.addLayer(ru_yus7)
      ru_yus7.setVisible(false)
    }
  }
  if (leis == 10) {
    if (ru_yu4 == null) {
      var dianwei = []
      dianwei.push({
        name: '金屋浴场',
        time: '2022年6月18日-25日',
        type: '原油',
        ywzj: '最大5cm',
        lon: '119.54',
        lat: '39.89',
        lx: '溢油点',
        leixing: '溢油点'
      })
      // 添加溢油点固定点位
      addPoint(map, dianwei, 'yyd', false, false, false, 'qk')
      // 初始化设置溢油点不可见
      ru_yu4.setVisible(false)
      // 清除监听
      if (rus4_Listener) {
        ol.Observable.unByKey(rus4_Listener)
      }
      // 添加监听
      rus4_Listener = map.on('click', function(evt) {
        // 处理点击事件
        var feature = map.forEachFeatureAtPixel(evt.pixel, function(feature) {
          return feature
        }, { hitTolerance: 10 })
        closeInfoWin()
        if (feature) {
          if (feature['A']['leixing'] == '溢油点') {
            var item = feature['A']['item']
            eshuju.$refs.mapPopBox.mapPopDialog = true
            eshuju.$refs.mapPopBox.mapPopInfo = item
            eshuju.$refs.mapPopBox.mapPopType = 'yiyou'
          }
        }
      })
    }
  }
  // 通过URL筛选当前图层信息 - 和当前leis 来确定包含特征所有属性的对象
  axios.get(urls).then(res => {
    // `new ol.format.GML2()`：创建一个新的GML2格式对象。
    // readFeatures 是来自服务器响应的GML数据
    var features = new ol.format.GML2().readFeatures(res.data, {
      // 设置为地图视图当前的投影，确保数据的正确读取和显示
      featureProjection: map.getView().getProjection(), dataProjection: map.getView().getProjection()
    })
    const dians = []
    if (leis == 121) {
      var canvas = document.createElement('canvas')
      // 获取该`<canvas>`元素的2D渲染上下文，并存储在`context`变量中。这允许您在canvas上进行绘图操作。
      var context = canvas.getContext('2d')
      // 从OpenLayers库获取设备的像素比率，并存储在`pixelRatio`变量中。
      // 像素比率是一个表示设备像素与CSS像素之间关系的数字。
      // 例如，在Retina显示屏上，它可能是2，意味着每一个CSS像素实际上由2x2的设备像素表示.
      var pixelRatio = ol.has.DEVICE_PIXEL_RATIO
    }
    if (features.length) {
      // ----------------------------------- 有点位数据的图层 -----先进行添加点位数据 -------------------------------------------
      if (leis == 4) { // 涉海风险源厂区排口
        features.forEach(feature => {
          // getProperties()方法返回一个包含特征所有属性的对象
          var datas = feature.getProperties()
          datas['lon'] = datas['经度']
          datas['lat'] = datas['纬度']
          datas['lx'] = '涉海风险源厂区排口'
          dians.push(datas)
        })
      } else if (leis == 81) { // 水母点 - 先添加好点位
        features.forEach(feature => {
          var datas = feature.getProperties()
          datas['lon'] = datas['the_geom']['flatCoordinates'][1]
          datas['lat'] = datas['the_geom']['flatCoordinates'][0]
          var lb = datas['类别']
          if (lb == undefined) {
            lb = '大型水母捕捞船舶'
          } else {
            if (lb == '手摇木船') {
              lb = '手摇木船'
            } else if (lb == '电动船') {
              lb = '小型电动捕捞艇'
            } else if (lb == '兜网船') {
              lb = '中型水母捕捞兜网船'
            } else {
              lb = '大型水母捕捞船舶'
            }
          }
          datas['lb'] = lb
          datas['lx'] = '水母点'
          dians.push(datas)
        })
      } else if (leis == 11) {
        features.forEach(feature => {
          var datas = feature.getProperties()
          datas['lon'] = datas['经度']
          datas['lat'] = datas['纬度']
          datas['lx'] = '沉潜点'
          dians.push(datas)
        })
      } else if (leis == 12) {
        features.forEach(feature => {
          var datas = feature.getProperties()
          datas['lon'] = datas['Y']
          datas['lat'] = datas['X']
          datas['lx'] = '锚地点'
          dians.push(datas)
        })
      } else if (leis == 121) {
        features.forEach(feature => {
          var datas = feature.getProperties()
          feature.setProperties({
            V: feature['V'], leixing: leixing, type: 'mianlist'
          })
          var flatCoordinates = datas.the_geom.flatCoordinates
          for (var i = 0; i < flatCoordinates.length; i = i + 3) {
            var a = flatCoordinates[i]
            flatCoordinates[i] = a
            flatCoordinates[i + 1] = flatCoordinates[i + 1]
          }
        })
      } else if (leis == 110) {
        features.forEach(feature => {
          var datas = feature.getProperties()
          datas['lon'] = datas['X']
          datas['lat'] = datas['Y']
          datas['lx'] = '污水管网'
          dians.push(datas)
        })
      } else {
        features.forEach(feature => {
          var datas = feature.getProperties()
          feature.setProperties({
            V: feature['V'], leixing: leixing, type: 'mianlist', item: datas
          })
          var flatCoordinates = datas.the_geom.flatCoordinates
          for (var i = 0; i < flatCoordinates.length; i = i + 3) {
            var a = flatCoordinates[i]
            flatCoordinates[i] = flatCoordinates[i + 1]
            flatCoordinates[i + 1] = a
          }
        })
      }
      // ------------------------------------- 渲染图层 -----------------------------------
      if (leis == 1) {
        if (ru_haiss1 == null) {
          ru_haiss1 = new ol.layer.Tile({
            zIndex: 4, source: new ol.source.TileSuperMapRest({
              url: 'http://10.122.2.138:8090/iserver/services/map-QHDXXQ/rest/maps/秦皇岛泵站管网_管道流向', //  这是数据源的URL，它指向一个SuperMap iServer的REST服务，用于获取地图tile。
              wrapX: true, tileGrid: new ol.tilegrid.WMTS({
                tileSize: [256, 256],
                origin: [116.67318111208851, 41.00364800113721],
                extent: [116.67318111208851, 38.18799033840105, 120.89666760619275, 41.00364800113721],
                resolutions: getLods()[0],
                matrixIds: getLods()[1]
              })
            }), projection: 'EPSG:4326'
          })
          map.addLayer(ru_haiss1)
          ru_haiss1.setVisible(false)
        }
        if (ru_hai1 == null) {
          ru_hai1 = []
          features.forEach(feature => {
            var zonglist = []
            // 获取当前feature的属性，并将其存储在datas变量中。
            var datas = feature.getProperties()
            // 从datas中获取the_geom属性，并进一步获取其flatCoordinates属性，即该特征的平面坐标
            var flatCoordinates = datas.the_geom.flatCoordinates
            // 遍历flatCoordinates数组，每次迭代增加3，因为每个坐标点由三个值（x, y, [z]）组成
            for (var i = 0; i < flatCoordinates.length; i = i + 3) {
              // 分别获取当前坐标点的x和y值
              var a = flatCoordinates[i]
              var b = flatCoordinates[i + 1]
              // 将x和y值作为一对坐标点推入zonglist数组
              zonglist.push([a, b])
            }
            // 定义一个样式函数styleFunction，它接受一个feature作为参数。
            const styleFunction = function(feature) {
              const geometry = feature.getGeometry()
              return new ol.style.Style({
                // 定义线条样式，包括颜色和宽度
                stroke: new ol.style.Stroke({
                  color: '#ff4f4f', width: 2
                }), // 定义填充样式
                fill: new ol.style.Fill({
                  color: '#ff4f4f'
                })
              })
            }
            // 创建一个新的矢量数据源。
            var source = new ol.source.Vector()
            var _feature = new ol.Feature({
              // 设置该特征的几何体为一个由zonglist中的坐标点组成的折线。
              geometry: new ol.geom.LineString(zonglist), leixing: leixing, Layer: datas['Layer'], type: 'mianlist'
            })
            // 将新创建的_feature添加到矢量数据源中。
            source.addFeature(_feature)
            // 创建一个新的矢量图层。
            var hxx = new ol.layer.Vector({
              zIndex: 4, source: source, // new ol.source.Vector({ features }),
              style: styleFunction
            })
            map.addLayer(hxx)
            hxx.setVisible(false)
            ru_hai1.push(hxx)
          })
        }
      } else if (leis == 19) {
        if (ru_hais1 == null) {
          ru_hais1 = new ol.layer.Vector({
            zIndex: 4, source: new ol.source.Vector({ features }), style: function(feature) {
              return new ol.style.Style({
                stroke: new ol.style.Stroke({
                  color: '#ff4f4f', width: 2
                }), fill: new ol.style.Fill({
                  color: '#ff4f4f'
                })
              })
            }
          })
          map.addLayer(ru_hais1)
          ru_hais1.setVisible(false)
        }
      } else if (leis == 2) {
        if (ru_hai2 == null) {
          // 创建一个新的矢量图层，并将其赋值给ru_hai2变量
          ru_hai2 = new ol.layer.Vector({
            zIndex: 4, // 设置图层的数据源为ol.source.Vector，其中features是之前定义好的一个特征集合。
            source: new ol.source.Vector({ features }), // 定义一个样式函数，它接受一个feature参数，并返回一个样式对象
            style: function(feature) {
              var name = feature.get('名称')
              var colors = '#6DDFA8'
              if (name == '二厂收水范围') {
                feature.setProperties({
                  anotherName: '秦皇岛秦南水务有限公司'
                })
                colors = '#C2FF00'
              } else if (name == '三厂收水范围') {
                feature.setProperties({
                  anotherName: '北控（秦皇岛）水务有限责任公司第三污水处理厂'
                })
                colors = '#00FE00'
              } else if (name == '四厂（国中）收水范围') {
                feature.setProperties({
                  anotherName: '国中（秦皇岛）污水处理有限公司'
                })
                colors = '#FEFE00'
              } else if (name == '五厂（山海关）收水范围') {
                feature.setProperties({
                  anotherName: '中冶秦皇岛水务有限公司'
                })
                colors = '#00DE00'
              } else if (name == '北部片区污水厂收水范围') {
                feature.setProperties({
                  anotherName: '秦皇岛秦北水务有限公司'
                })
                colors = '#00FEFE'
              } else if (name == '中冶抚宁污水厂收水范围') {
                feature.setProperties({
                  anotherName: '秦皇岛市抚宁区中冶水务有限公司'
                })
                colors = '#FDFE99'
              } else if (name == '华电团林污水厂收水范围') {
                feature.setProperties({
                  anotherName: '华电水务秦皇岛有限公司'
                })
                colors = '#99FE99'
              } else if (name == '华电团林厂收水范围') {
                feature.setProperties({
                  anotherName: '秦皇岛秦东水务有限公司'
                })
                colors = '#99FE99'
              } else if (name == '一厂收水范围') {
                feature.setProperties({
                  anotherName: '秦皇岛秦东水务有限公司'
                })
              }
              return new ol.style.Style({
                stroke: new ol.style.Stroke({
                  // 设置了描边的颜色为黑色
                  color: '#000', width: 1
                }), fill: new ol.style.Fill({
                  // 设置了填充的颜色。这里使用了一个变量colors，它的值是根据之前代码中name属性的不同值而变化的
                  color: colors
                })
              })
            }
          })
          map.addLayer(ru_hai2)
          ru_hai2.setVisible(false)
        }
      } else if (leis == 3) {
      } else if (leis == 4) {
        if (ru_hai4 == null) {
          addPoint(map, dians, 'cqpk', false, false, false, 'qk')
          ru_hai4.setVisible(false)
        }
      } else if (leis == 5) {
        if (ru_hai5 == null) {
          ru_hai5 = new ol.layer.Vector({
            zIndex: 4, source: new ol.source.Vector({ features }), style: function(feature) {
              return new ol.style.Style({
                stroke: new ol.style.Stroke({
                  color: '#999899', width: 1
                }), fill: new ol.style.Fill({
                  color: '#e0cfe2'
                })
              })
            }
          })
          map.addLayer(ru_hai5)
          ru_hai5.setVisible(false)
        }
      } else if (leis == 6) {
        if (ru_hai6 == null) {
          ru_hai6 = new ol.layer.Vector({
            zIndex: 4, source: new ol.source.Vector({ features }), style: function(feature) {
              var name = feature.get('NAME')
              var HXLX = feature.get('HXLX')
              var colors = '#ffffcc'
              if (name == '河北平原河湖滨岸带生态保护红线') {
                colors = '#fcd8db'
              } else if (name == '南戴河海域水产种质保护区') {
                colors = '#81e8d1'
              } else if (name == '山海关旅游区') {
                colors = '#81e8d1'
              } else if (name == '石河河口') {
                colors = '#87ccf2'
              }
              return new ol.style.Style({
                stroke: new ol.style.Stroke({
                  color: '#999899', width: 1
                }), fill: new ol.style.Fill({
                  color: colors
                })
              })
            }
          })
          map.addLayer(ru_hai6)
          ru_hai6.setVisible(false)
        }
      } else if (leis == 110) {
        if (beng_tc == null) {
          addPoint(map, dians, 'wsgw', false, false, false, 'qk')
          beng_tc.setVisible(false)
        }
      } else if (leis == 7) {
        if (ru_yu1 == null) {
          ru_yu1 = new ol.layer.Vector({
            zIndex: 4, source: new ol.source.Vector({ features }), opacity: 0
          })
          map.addLayer(ru_yu1)
          ru_yu1.setVisible(false)
        }
      } else if (leis == 8) {
        if (ru_yu2 == null) {
          ru_yu2 = new ol.layer.Vector({
            zIndex: 4, properties: 'smlist', source: new ol.source.Vector({ features }), style: function(feature) {
              return new ol.style.Style({
                stroke: new ol.style.Stroke({
                  color: '#000', width: 2
                })
              })
            }
          })
          map.addLayer(ru_yu2)
          ru_yu2.setVisible(false)
          // 清除监听
          if (ru2_Listener) {
            ol.Observable.unByKey(ru2_Listener)
          }
          // 添加监听
          ru2_Listener = map.on('click', function(evt) {
            // 处理点击事件
            var feature = map.forEachFeatureAtPixel(evt.pixel, function(feature) {
              return feature
            }, { hitTolerance: 10 })
            closeInfoWin()
            if (feature) {
              if (feature['A']['leixing'] == '水母') {
                const item = feature['A']
                eshuju.$refs.mapPopBox.mapPopDialog = true
                eshuju.$refs.mapPopBox.mapPopInfo = item
                eshuju.$refs.mapPopBox.mapPopType = 'shuimudian'
              }
            }
          })
        }
      } else if (leis == 81) {
        if (ru_yus2 == null) {
          addPoint(map, dians, 'smd', false, false, false, 'qk')
          ru_yus2.setVisible(false)
          // 清除监听
          if (rus2_Listener) {
            ol.Observable.unByKey(rus2_Listener)
          }
          // 添加监听
          rus2_Listener = map.on('click', function(evt) {
            // 处理点击事件
            var feature = map.forEachFeatureAtPixel(evt.pixel, function(feature) {
              return feature
            }, { hitTolerance: 10 })
            // 关闭点位悬浮框
            closeInfoWin()
            if (feature) {
              if (feature['A']['type'] == 'smd') {
                const item = feature['A']
                eshuju.$refs.mapPopBox.mapPopDialog = true
                eshuju.$refs.mapPopBox.mapPopInfo = item
                eshuju.$refs.mapPopBox.mapPopType = 'shuimudian'
              }
            }
          })
        }
      } else if (leis == 9) {
        if (ru_yu3 == null) {
          ru_yu3 = new ol.layer.Vector({
            zIndex: 4, source: new ol.source.Vector({ features }), style: function(feature) {
              return new ol.style.Style({
                stroke: new ol.style.Stroke({
                  color: '#000', width: 2
                }), fill: new ol.style.Fill({
                  color: '#89ce66'
                })
              })
            }
          })
          map.addLayer(ru_yu3)
          ru_yu3.setVisible(false)
          // 清除监听
          if (ru3_Listener) {
            ol.Observable.unByKey(ru3_Listener)
          }
          // 添加监听
          ru3_Listener = map.on('click', function(evt) {
            // 处理点击事件
            var feature = map.forEachFeatureAtPixel(evt.pixel, function(feature) {
              return feature
            }, { hitTolerance: 10 })
            closeInfoWin()
            if (feature) {
              if (feature['A']['leixing'] == '藻类') {
                const item = feature['A']
                eshuju.$refs.mapPopBox.mapPopDialog = true
                eshuju.$refs.mapPopBox.mapPopInfo = item
                eshuju.$refs.mapPopBox.mapPopType = 'shuizao'
              }
            }
          })
        }
      } else if (leis == 11) {
        if (ru_yu5 == null) {
          addPoint(map, dians, 'cqd', false, true, false, 'qk')
          ru_yu5.setVisible(false)
          // 清除监听
          if (rus5s_Listener) {
            ol.Observable.unByKey(rus5s_Listener)
          }
          // 添加监听
          rus5s_Listener = map.on('click', function(evt) {
            // 处理点击事件
            var feature = map.forEachFeatureAtPixel(evt.pixel, function(feature) {
              return feature
            }, { hitTolerance: 10 })
            closeInfoWin()
            if (feature) {
              if (feature['A']['leixing'] == '沉潜点') {
                var item = feature['A']
                var mz = ''
                if (item['item']['备注'] == 'A') {
                  mz = '葡萄岛和洋河口之间'
                } else if (item['item']['备注'] == 'B') {
                  mz = '葡萄岛和洋河口之间'
                } else if (item['item']['备注'] == 'C') {
                  mz = '浅水湾'
                } else if (item['item']['备注'] == 'D') {
                  mz = '浅水湾'
                }
                item['mingzis'] = mz
                eshuju.$refs.mapPopBox.mapPopDialog = true
                eshuju.$refs.mapPopBox.mapPopInfo = item
                eshuju.$refs.mapPopBox.mapPopType = 'chenqian'
              }
            }
          })
        }
      } else if (leis == 111) {
        if (ru_yus5 == null) {
          ru_yus5 = new ol.layer.Vector({
            zIndex: 4, source: new ol.source.Vector({ features }), style: function(feature) {
              return new ol.style.Style({
                stroke: new ol.style.Stroke({
                  color: '#000', width: 2
                })
              })
            }
          })
          map.addLayer(ru_yus5)
          ru_yus5.setVisible(false)
          // 清除监听
          if (rus5_Listener) {
            ol.Observable.unByKey(rus5_Listener)
          }
          // 添加监听
          rus5_Listener = map.on('click', function(evt) {
            // 处理点击事件
            var feature = map.forEachFeatureAtPixel(evt.pixel, function(feature) {
              return feature
            }, { hitTolerance: 10 })
            closeInfoWin()
            if (feature) {
              if (feature['A']['leixing'] == '沉潜连线') {
                var item = feature['A']
                item['mingzis'] = item['备注'] == 'AB' ? '葡萄岛和洋河口之间' : '浅水湾'
                eshuju.$refs.mapPopBox.mapPopDialog = true
                eshuju.$refs.mapPopBox.mapPopInfo = item
                eshuju.$refs.mapPopBox.mapPopType = 'chenqian'
              }
            }
          })
        }
      } else if (leis == 12) {
        if (ru_yu_6 == null) {
          maodianlist = dians
          addPoint(map, dians, 'mdd', false, false, false, 'qk')
          ru_yu_6.setVisible(false)
        }
      } else if (leis == 121) {
        if (ru_yu6 == null) {
          ru_yu6 = new ol.layer.Vector({
            zIndex: 4,
            properties: 'mdlist',
            source: new ol.source.Vector({ features }),
            style: function(feature, resolution) {
              return new ol.style.Style({
                stroke: new ol.style.Stroke({
                  color: '#B2C1D0', width: 1
                }), fill: new ol.style.Fill({
                  color: gradient(feature, resolution, canvas, context, pixelRatio, ol)
                })
              })
            }
          })
          map.addLayer(ru_yu6)
          ru_yu6.setVisible(false)
          // 清除监听
          if (rus6_Listener) {
            ol.Observable.unByKey(rus6_Listener)
          }
          // 添加监听
          rus6_Listener = map.on('click', function(evt) {
            // 处理点击事件
            var feature = map.forEachFeatureAtPixel(evt.pixel, function(feature) {
              return feature
            }, { hitTolerance: 10 })
            closeInfoWin()
            if (feature) {
              if (feature['A']['leixing'] == '锚地面') {
                var item = feature['A']
                var zongjwd = []
                var xinzu = []
                var flatCoordinates = item.the_geom.flatCoordinates
                for (var i = 0; i < flatCoordinates.length; i = i + 3) {
                  var a = flatCoordinates[i]
                  zongjwd.push({
                    lon: a, lat: flatCoordinates[i + 1]
                  })
                }
                zongjwd.pop()
                item['zongjwd'] = zongjwd

                for (var i = 0; i < maodianlist.length; i++) {
                  if (maodianlist[i]['锚地'] == item['锚地']) {
                    xinzu.push(maodianlist[i])
                  }
                }
                item['maodianlist'] = xinzu
                eshuju.$refs.mapPopBox.mapPopDialog = true
                eshuju.$refs.mapPopBox.mapPopInfo = item
                eshuju.$refs.mapPopBox.mapPopType = 'miaodi'
              }
            }
          })
        }
      } else if (leis == 13) {
        if (ru_yu7 == null) {
          ru_yu7 = new ol.layer.Vector({
            zIndex: 4, source: new ol.source.Vector({ features }), opacity: 0
          })
          map.addLayer(ru_yu7)
          ru_yu7.setVisible(false)
        }
      }
      if (leis != 8 && leis != 11) {
        pointerHover(map, 'mianlist')
      }
    }
  })
}

export function chulibengzhan(sfxs) {
  if (beng_tc != null) {
    // console.log('sfxs', sfxs);
    beng_tc.setVisible(sfxs)
  }
}

// ----------------------------------------------------------------------------
export function loadxingshi(map, leis, urls, leixing) {
  axios.get(urls).then(res => {
    var features = new ol.format.GML2().readFeatures(res.data, {
      featureProjection: map.getView().getProjection(), dataProjection: map.getView().getProjection()
    })
    const dians = []
    if (features.length) {
      if (leis == 3) {
        features.forEach(feature => {
          var datas = feature.getProperties()
          datas['lon'] = datas['经度']
          datas['lat'] = datas['纬度']
          dians.push(datas)
        })
      } else {
        features.forEach(feature => {
          var datas = feature.getProperties()
          feature.setProperties({
            V: feature['V'], leixing: leixing, type: 'mianlist'
          })
          var flatCoordinates = datas.the_geom.flatCoordinates
          for (var i = 0; i < flatCoordinates.length; i = i + 3) {
            var a = flatCoordinates[i]
            flatCoordinates[i] = flatCoordinates[i + 1]
            flatCoordinates[i + 1] = a
          }
        })
      }
      if (leis == 1) {
        if (haiyangtu1 == null) {
          haiyangtu1 = new ol.layer.Vector({
            source: new ol.source.Vector({ features }), style: new ol.style.Style({
              stroke: new ol.style.Stroke({
                color: yansechuzhi(leis), width: 1.5
              })
            })
          })
          map.addLayer(haiyangtu1)
          haiyangtu1.setVisible(false)
        }
      } else if (leis == 2) {
        if (haiyangtu2 == null) {
          haiyangtu2 = new ol.layer.Vector({
            source: new ol.source.Vector({ features }), style: new ol.style.Style({
              stroke: new ol.style.Stroke({
                color: yansechuzhi(leis), width: 1.5
              })
            })
          })
          map.addLayer(haiyangtu2)
          haiyangtu2.setVisible(false)
        }
      } else if (leis == 3) {
        if (haiyangtu3 == null) {
          addPoint(map, dians, 'mianlist', false, false, false, 'qk')
          haiyangtu3.setVisible(false)
        }
      } else if (leis == 4) {
        if (haiyangtu4 == null) {
          haiyangtu4 = new ol.layer.Vector({
            source: new ol.source.Vector({ features }), style: new ol.style.Style({
              stroke: new ol.style.Stroke({
                color: yansechuzhi(leis), width: 1.5
              })
            })
          })
          map.addLayer(haiyangtu4)
          haiyangtu4.setVisible(false)
        }
      } else if (leis == 5) {
        if (haiyangtu5 == null) {
          haiyangtu5 = new ol.layer.Vector({
            zIndex: 3, source: new ol.source.Vector({ features }), style: function(feature) {
              // 根据特定属性值设置不同的填充颜色
              let fillColor
              var mingcheng = feature.get('名称')
              if (mingcheng === '秦皇岛北部湾区') {
                fillColor = '#7bb4ad'
              } else if (mingcheng === '秦皇岛港区') {
                fillColor = '#9bae96'
              } else if (mingcheng === '秦皇岛湾') {
                fillColor = '#94b7ca'
              } else if (mingcheng === '唐山湾') {
                fillColor = '#8787c1'
              } else if (mingcheng === '滦河口') {
                fillColor = '#D1D1A9'
              } else if (mingcheng === '唐山西部湾区') {
                fillColor = '#96d0b2'
              } else if (mingcheng === '沧州北部湾区') {
                fillColor = '#a6acd5'
              } else if (mingcheng === '沧州南部湾区') {
                fillColor = '#abd0c1'
              } else {
                fillColor = '#D1D1A9'
              }
              return new ol.style.Style({
                stroke: new ol.style.Stroke({
                  color: '#535353', width: 1.5
                }), fill: new ol.style.Fill({
                  color: fillColor
                })
              })
            }
          })
          map.addLayer(haiyangtu5)
          haiyangtu5.setVisible(false)
        }
        if (wqzhuji_wq == null) {
          wqzhuji_wq = new ol.layer.Tile({
            zIndex: 5, source: new ol.source.TileSuperMapRest({
              url: 'http://10.122.2.138:8090/iserver/services/map-agscache-wqhfzj1/rest/maps/wqhf_zj1',
              wrapX: true,
              tileGrid: new ol.tilegrid.WMTS({
                tileSize: [256, 256],
                origin: [116.67318111208851, 41.00364800113721],
                extent: [116.67318111208851, 38.18799033840105, 120.89666760619275, 41.00364800113721],
                resolutions: getLods()[0],
                matrixIds: getLods()[1]
              })
            }), projection: 'EPSG:4326'
          })
          map.addLayer(wqzhuji_wq)
          wqzhuji_wq.setVisible(false)
        }
      } else if (leis == 6) {
        if (haiyangtu6 == null) {
          haiyangtu6 = new ol.layer.Vector({
            zIndex: 3, source: new ol.source.Vector({ features }), style: function(feature) {
              // 根据特定属性值设置不同的填充颜色
              let fillColor
              var mingcheng = feature.get('时序')
              if (mingcheng === '“十四五”时期美丽海湾建成区') {
                fillColor = '#f6b3b4'
              } else if (mingcheng === '“十五五”时期美丽海湾建成区') {
                fillColor = '#70b17b'
              } else if (mingcheng === '“十六五”时期美丽海湾建成区') {
                fillColor = '#2871b8'
              }
              return new ol.style.Style({
                stroke: new ol.style.Stroke({
                  color: '#535353', width: 1.5
                }), fill: new ol.style.Fill({
                  color: fillColor
                })
              })
            }
          })
          map.addLayer(haiyangtu6)
          haiyangtu6.setVisible(false)
        }
        if (wqzhuji_ds == null) {
          wqzhuji_ds = new ol.layer.Tile({
            zIndex: 5, source: new ol.source.TileSuperMapRest({
              url: 'http://10.122.2.138:8090/iserver/services/map-agscache-wqhfzj2/rest/maps/wqhf_zj2',
              wrapX: true,
              tileGrid: new ol.tilegrid.WMTS({
                tileSize: [256, 256],
                origin: [116.67318111208851, 41.00364800113721],
                extent: [116.67318111208851, 38.18799033840105, 120.89666760619275, 41.00364800113721],
                resolutions: getLods()[0],
                matrixIds: getLods()[1]
              })
            }), projection: 'EPSG:4326'
          })
          map.addLayer(wqzhuji_ds)
          wqzhuji_ds.setVisible(false)
        }
      } else if (leis == 7) {
        if (haiyangtu7 == null) {
          haiyangtu7 = new ol.layer.Vector({
            zIndex: 3, source: new ol.source.Vector({ features }), style: new ol.style.Style({
              stroke: new ol.style.Stroke({
                color: '#535353', width: 1
              })
            })
          })
          map.addLayer(haiyangtu7)
          haiyangtu7.setVisible(false)
        }
      } else if (leis == 8) {
        if (haitu1 == null) {
          haitu1 = new ol.layer.Vector({
            zIndex: 4, source: new ol.source.Vector({ features }), style: function(feature) {
              return new ol.style.Style({
                stroke: new ol.style.Stroke({
                  color: '#535353', width: 1
                }), fill: new ol.style.Fill({
                  color: '#878AC3'
                })
              })
            }
          })
          map.addLayer(haitu1)
          haitu1.setVisible(false)
        }
      } else if (leis == 9) {
        if (haitu2 == null) {
          haitu2 = new ol.layer.Vector({
            zIndex: 4, source: new ol.source.Vector({ features }), style: function(feature) {
              return new ol.style.Style({
                stroke: new ol.style.Stroke({
                  color: '#535353', width: 1
                }), fill: new ol.style.Fill({
                  color: '#878AC3'
                })
              })
            }
          })
          map.addLayer(haitu2)
          haitu2.setVisible(false)
        }
      }
      if (leis != 3) {
        pointerHover(map, 'mianlist')
      }
      if (leis == 5 || leis == 6 || leis == 8 || leis == 9) {
        if (dianListener1) {
          ol.Observable.unByKey(dianListener1)
        }
        dianListener1 = map.on('click', function(evt) {
          var feature = map.forEachFeatureAtPixel(evt.pixel, function(feature) {
            return feature
          }, { hitTolerance: 10 })
          if (feature) {
            const res = feature.getProperties()
          }
        })
      }
    }
  })
}

export function yanserh(leis) {
  switch (leis) {
    case 4:
      return '#9DD681'
      break
    default:
      return '#000'// #ffff00
      break
  }
}

export function yansechuzhi(leis) {
  switch (leis) {
    case 4:
      return '#9DD681'
      break
    case 5:
      return '#80D1C8'
      break
    case 6:
      return '#0AA7EC'
      break
    default:
      return '#DEA4A3'
      break
  }
}

/**
 * 渲染多图层
 * @param val
 */
export function xyduotc(val) {
  var sfxs = eshuju['jcdvalue' + val]
  if (val == 1) {
    if (pointtuceng != null) { // 近岸海域监测点
      pointtuceng.setVisible(sfxs)
    }
  } else if (val == 2) {
    if (haiyangtu3 != null) {
      haiyangtu3.setVisible(sfxs)
    }
  } else if (val == 3) {
    if (haiyangtu1 != null) {
      haiyangtu1.setVisible(sfxs)
    }
  } else if (val == 4) {
    if (haiyangtu2 != null) {
      haiyangtu2.setVisible(sfxs)
    }
  } else if (val == 5) {
    if (haiyangtu4 != null) {
      haiyangtu4.setVisible(sfxs)
    }
  } else if (val == 7) {
    if (haiyangtu5 != null) {
      haiyangtu5.setVisible(sfxs)
    }
    if (wqzhuji_wq != null) {
      wqzhuji_wq.setVisible(sfxs)
    }
    if (haiyangtu6 != null) {
      haiyangtu6.setVisible(false)
    }
    if (haitu1 != null) {
      haitu1.setVisible(false)
    }
    if (haitu2 != null) {
      haitu2.setVisible(false)
    }
    if (wqzhuji_ds != null) {
      wqzhuji_ds.setVisible(false)
    }
  } else if (val == 8) {
    if (haiyangtu6 != null) {
      haiyangtu6.setVisible(sfxs)
    }
    if (haitu1 != null) {
      haitu1.setVisible(sfxs)
    }
    if (haitu2 != null) {
      haitu2.setVisible(sfxs)
    }
    if (wqzhuji_ds != null) {
      wqzhuji_ds.setVisible(sfxs)
    }
    if (haiyangtu5 != null) {
      haiyangtu5.setVisible(false)
    }
    if (wqzhuji_wq != null) {
      wqzhuji_wq.setVisible(false)
    }
  } else if (val == 'ywtc') {
    sfxs = eshuju.jcdvalue
    if (pointtuceng != null) { // 近岸海域监测点
      pointtuceng.setVisible(sfxs)
    }
    if (haiyangtu1 != null) {
      haiyangtu1.setVisible(sfxs)
    }
    if (haiyangtu2 != null) {
      haiyangtu2.setVisible(sfxs)
    }
    if (haiyangtu3 != null) {
      haiyangtu3.setVisible(sfxs)
    }
    if (haiyangtu4 != null) {
      haiyangtu4.setVisible(sfxs)
    }
  } else if (val == 'wqhf') {
    sfxs = eshuju.jcdvalue6
    if (haiyangtu5 != null) {
      haiyangtu5.setVisible(sfxs)
    }
    if (wqzhuji_wq != null) {
      wqzhuji_wq.setVisible(sfxs)
    }
    if (haiyangtu6 != null) {
      haiyangtu6.setVisible(sfxs)
    }
    if (haitu1 != null) {
      haitu1.setVisible(sfxs)
    }
    if (haitu2 != null) {
      haitu2.setVisible(sfxs)
    }
    if (wqzhuji_ds != null) {
      wqzhuji_ds.setVisible(sfxs)
    }
  } else if (val == 18) {
    if (eshuju.bdhdwlist.rhdm != null) {
      eshuju.bdhdwlist.rhdm.setVisible(sfxs)
    }
  } else if (val == 19) {
    // 浴场监测点
    if (eshuju.bdhdwlist.ycjcd != null) {
      eshuju.bdhdwlist.ycjcd.setVisible(sfxs)
    }
  } else if (val == 20) {
    // 保障监测点
    if (eshuju.bdhdwlist.bzjcd != null) {
      eshuju.bdhdwlist.bzjcd.setVisible(sfxs)
    }
  } else if (val == 21) {
    // 港池内
    if (eshuju.bdhdwlist.gcn != null) {
      eshuju.bdhdwlist.gcn.setVisible(sfxs)
    }
  } else if (val == 22) {
    // 港池外
    if (eshuju.bdhdwlist.gcw != null) {
      eshuju.bdhdwlist.gcw.setVisible(sfxs)
    }
  } else if (val == 23) {
    // 污水处理厂
    if (eshuju.bdhdwlist.wsclc != null) {
      eshuju.bdhdwlist.wsclc.setVisible(sfxs)
    }
  } else if (val == 25) {
    // 雨洪排口
    if (eshuju.bdhdwlist.yhpk != null) {
      eshuju.bdhdwlist.yhpk.setVisible(sfxs)
    }
  } else if (val == 26) {
    // 入海口
    if (eshuju.bdhdwlist.rhk != null) {
      eshuju.bdhdwlist.rhk.setVisible(sfxs)
    }
  }
  // -----海域监测点--------------
  else if (val == 10) {
    // 重点海水浴场监测点位
    if (eshuju.bdhdwlist.ycjcd != null) {
      eshuju.bdhdwlist.ycjcd.setVisible(sfxs)
    }
  } else if (val == 11) {
    // 声环境质量监测点位
    if (eshuju.bdhdwlist.zs != null) {
      eshuju.bdhdwlist.zs.setVisible(sfxs)
    }
  } else if (val == 12) {
    // 环境空气质量监测点位
    if (eshuju.bdhdwlist.dq != null) {
      eshuju.bdhdwlist.dq.setVisible(sfxs)
    }
  } else if (val == 13) {
    // 近岸海域水质监测点位
    if (eshuju.bdhdwlist.jahysjqx != null) {
      eshuju.bdhdwlist.jahysjqx.setVisible(sfxs)
    }
  } else if (val == 14) {
    // 集中式生活饮用水水源地监测点位
    if (eshuju.bdhdwlist.yysyd != null) {
      eshuju.bdhdwlist.yysyd.setVisible(sfxs)
    }
  } else if (val == 16) {
    // 集中式生活饮用水水源地监测点位
    if (eshuju.bdhdwlist.zph != null) {
      eshuju.bdhdwlist.zph.setVisible(sfxs)
    }
  } else if (val == 15) {
    // 入海河流水质监测点位
    if (eshuju.bdhdwlist.zph != null) {
      eshuju.bdhdwlist.rhdm.setVisible(sfxs)
    }
  } else if (val == 'hyjcd') {
    sfxs = eshuju.jcdvalue9
    if (eshuju.bdhdwlist.zs != null) {
      eshuju.bdhdwlist.zs.setVisible(sfxs)
    }
    if (eshuju.bdhdwlist.dq != null) {
      eshuju.bdhdwlist.dq.setVisible(sfxs)
    }
    if (eshuju.bdhdwlist.jahysjqx != null) {
      eshuju.bdhdwlist.jahysjqx.setVisible(sfxs)
    }
    if (eshuju.bdhdwlist.yysyd != null) {
      eshuju.bdhdwlist.yysyd.setVisible(sfxs)
    }
    if (eshuju.bdhdwlist.zph != null) {
      eshuju.bdhdwlist.zph.setVisible(sfxs)
    }
  } else if (val == 33) {
    console.log('污水管网流向开关状态：', sfxs)
    if (ru_hai1 != null && ru_hai1.length != 0) {
      for (var m = 0; m < ru_hai1.length; m++) {
        ru_hai1[m].setVisible(sfxs)
      }
      // ru_hai1.setVisible(sfxs)
    }
    if (ru_hais1 != null) {
      ru_hais1.setVisible(sfxs)
    }
    if (ru_haiss1 != null) {
      ru_haiss1.setVisible(sfxs)
    }
  } else if (val == 34) {
    if (ru_hai2 != null) {
      ru_hai2.setVisible(sfxs)
    }
  } else if (val == 35) {
    console.log('管网溢流破损点位状态', ru_hai3)
    if (ru_hai3 != null) {
      ru_hai3.setVisible(sfxs)
    } else {
      initguanwang(sfxs)
    }
  } else if (val == 36) {
    if (ru_hai4 != null) {
      ru_hai4.setVisible(sfxs)
    }
  } else if (val == 37) {
    if (ru_hai5 != null) {
      ru_hai5.setVisible(sfxs)
    }
  } else if (val == 38) {
    if (ru_hai6 != null) {
      ru_hai6.setVisible(sfxs)
    }
  } else if (val == 'rhxx') {
    // sfxs 先获取到入海河流水质图层开关的状态
    sfxs = eshuju.jcdvalue32
    if (ru_hai1 != null) {
      if (ru_hai1.length != 0) {
        for (var m = 0; m < ru_hai1.length; m++) {
          ru_hai1[m].setVisible(sfxs)
        }
      }
      // ru_hai1.setVisible(sfxs)
    }
    if (ru_hais1 != null) {
      ru_hais1.setVisible(sfxs)
    }
    if (ru_haiss1 != null) {
      ru_haiss1.setVisible(sfxs)
    }
    if (ru_hai2 != null) {
      ru_hai2.setVisible(sfxs)
    }
    if (ru_hai3 != null) {
      ru_hai3.setVisible(sfxs)
    } else {
      initguanwang(sfxs)
    }
    if (ru_hai4 != null) {
      ru_hai4.setVisible(sfxs)
    }
    if (ru_hai5 != null) {
      ru_hai5.setVisible(sfxs)
    }
    // if(ru_hai6!=null){
    //   ru_hai6.setVisible(sfxs)
    // }
  } else if (val == 40) {
    if (ru_yu1 != null) {
      ru_yu1.setVisible(sfxs)
    }
    if (ru_yus1 != null) {
      ru_yus1.setVisible(sfxs)
    }
  } else if (val == 47) {
    if (ru_yu7 != null) {
      ru_yu7.setVisible(sfxs)
    }
    if (ru_yus7 != null) {
      ru_yus7.setVisible(sfxs)
    }
  } else if (val == 41) {
    if (ru_yu2 != null) {
      ru_yu2.setVisible(sfxs)
    }
    if (ru_yus2 != null) {
      ru_yus2.setVisible(sfxs)
    }
  } else if (val == 42) {
    if (ru_yu3 != null) {
      ru_yu3.setVisible(sfxs)
    }
  } else if (val == 43) {
    if (ru_yu4 != null) {
      ru_yu4.setVisible(sfxs)
    }
  } else if (val == 44) {
    if (ru_yu5 != null) {
      ru_yu5.setVisible(sfxs)
    }
    if (ru_yus5 != null) {
      ru_yus5.setVisible(sfxs)
    }
  } else if (val == 45) {
    if (ru_yu6 != null) {
      ru_yu6.setVisible(sfxs)
    }
    if (ru_yu_6 != null) {
      ru_yu_6.setVisible(sfxs)
    }
  } else if (val == 46) {
    if (haiyangtu6 != null) {
      haiyangtu6.setVisible(sfxs)
    }
    if (haitu1 != null) {
      haitu1.setVisible(sfxs)
    }
    if (haitu2 != null) {
      haitu2.setVisible(sfxs)
    }

    if (wqzhuji_ds != null) {
      wqzhuji_ds.setVisible(sfxs)
    }
    if (wqzhuji_wq != null) {
      wqzhuji_wq.setVisible(sfxs)
    }
  }
  // 北戴河 - 近岸海域 - 监测图例
  else if (val === 'bdh_jahy_jctl') {
    // sfxs 是近岸海域图层开关的状态
    sfxs = eshuju.jcdvalue400
    if (ru_yu1 != null) { // 赤潮：这个赤潮目前不展示在图层上
      ru_yu1.setVisible(sfxs)
    }
    if (ru_yus1 != null) { // 历年赤潮（水色异常）
      ru_yus1.setVisible(sfxs)
    }
    if (ru_yu7 != null) {
      ru_yu7.setVisible(sfxs)
    }
    if (ru_yus7 != null) { // 赤潮削减图层
      ru_yus7.setVisible(sfxs)
    }
    if (ru_yu2 != null) {
      ru_yu2.setVisible(sfxs)
    }
    if (ru_yus2 != null) { // 水母打捞作业区、拦截导流网
      ru_yus2.setVisible(sfxs)
    }
    if (ru_yu3 != null) { // 大型藻类多发区域（集中打捞作业区）
      ru_yu3.setVisible(sfxs)
    }
    if (ru_yu4 != null) { // 历年溢油污染事故点
      ru_yu4.setVisible(sfxs)
    }
    if (ru_yu5 != null) {
      ru_yu5.setVisible(sfxs)
    }
    if (ru_yus5 != null) { // 沉潜油拦截网图示
      ru_yus5.setVisible(sfxs)
    }
    if (ru_yu6 != null) {
      ru_yu6.setVisible(sfxs)
    }
    if (ru_yu_6 != null) {
      ru_yu_6.setVisible(sfxs)
    }
    if (haiyangtu6 != null) {
      haiyangtu6.setVisible(sfxs)
    }
    if (haitu1 != null) {
      haitu1.setVisible(sfxs)
    }
    if (haitu2 != null) {
      haitu2.setVisible(sfxs)
    }
    if (wqzhuji_ds != null) {
      wqzhuji_ds.setVisible(sfxs)
    }
    if (wqzhuji_wq != null) {
      wqzhuji_wq.setVisible(sfxs)
    }
  } else if (val == 'lvwj') {
    sfxs = eshuju.jcdvalue31
    if (eshuju.bdhdwlist.rhdm != null) {
      eshuju.bdhdwlist.rhdm.setVisible(sfxs)
    }
    if (eshuju.bdhdwlist.ycjcd != null) {
      eshuju.bdhdwlist.ycjcd.setVisible(sfxs)
    }
    if (eshuju.bdhdwlist.bzjcd != null) {
      eshuju.bdhdwlist.bzjcd.setVisible(sfxs)
    }
    if (eshuju.bdhdwlist.gcn != null) {
      eshuju.bdhdwlist.gcn.setVisible(sfxs)
    }
    if (eshuju.bdhdwlist.gcw != null) {
      eshuju.bdhdwlist.gcw.setVisible(sfxs)
    }
    if (eshuju.bdhdwlist.wsclc != null) {
      eshuju.bdhdwlist.wsclc.setVisible(sfxs)
    }
    if (eshuju.bdhdwlist.yhpk != null) {
      eshuju.bdhdwlist.yhpk.setVisible(sfxs)
    }
    if (eshuju.bdhdwlist.rhk != null) {
      eshuju.bdhdwlist.rhk.setVisible(sfxs)
    }
  } else if (val == 'tl_qie1') {
    if (ru_yu1 != null) {
      ru_yu1.setVisible(true)
    }
    if (ru_yus1 != null) {
      ru_yus1.setVisible(true)
    }
    if (ru_yu7 != null) {
      ru_yu7.setVisible(true)
    }
    if (ru_yus7 != null) {
      ru_yus7.setVisible(true)
    }
  }
  // 渲染 - 水母打捞作业区、拦截导流网
  else if (val == 'tl_qie2') {
    if (ru_yu2 != null) {
      ru_yu2.setVisible(true)
    }
    if (ru_yus2 != null) {
      ru_yus2.setVisible(true)
    }
  } else if (val == 'tl_qie3') {
    if (ru_yu3 != null) {
      ru_yu3.setVisible(true)
    }
  } else if (val == 'tl_qie4') {
    if (ru_yu4 != null) {
      ru_yu4.setVisible(true)
    }
    if (ru_yu5 != null) {
      ru_yu5.setVisible(true)
    }
    if (ru_yus5 != null) {
      ru_yus5.setVisible(true)
    }
    if (ru_yu6 != null) {
      ru_yu6.setVisible(true)
    }
    if (ru_yu_6 != null) {
      ru_yu_6.setVisible(true)
    }
  }
}

// 污染源复选框方法
export function wryXz() {
  if (eshuju.wryListOpt) {
    if (eshuju.wryListOpt.includes('傍河村庄')) {
      eshuju.wryAllList.bhcz.setVisible(true)
    } else {
      eshuju.wryAllList.bhcz.setVisible(false)
    }
    // 入河排污口
    if (eshuju.wryListOpt.includes('入河排污口')) {
      eshuju.wryAllList.rhpwk.setVisible(true)
    } else {
      eshuju.wryAllList.rhpwk.setVisible(false)
    }

    // 规上畜禽养殖
    if (eshuju.wryListOpt.includes('规上畜禽养殖')) {
      eshuju.wryAllList.gscqyz.setVisible(true)
    } else {
      eshuju.wryAllList.gscqyz.setVisible(false)
    }

    // 规下畜禽养殖
    if (eshuju.wryListOpt.includes('规下畜禽养殖')) {
      eshuju.wryAllList.gxcqyz.setVisible(true)
    } else {
      eshuju.wryAllList.gxcqyz.setVisible(false)
    }

    // 水产养殖企业
    if (eshuju.wryListOpt.includes('水产养殖企业')) {
      eshuju.wryAllList.scyzqy.setVisible(true)
    } else {
      eshuju.wryAllList.scyzqy.setVisible(false)
    }

    // 污水处理厂
    if (eshuju.wryListOpt.includes('污水处理厂')) {
      eshuju.wryAllList.wsclc.setVisible(true)
    } else {
      eshuju.wryAllList.wsclc.setVisible(false)
    }

    // 涉氮企业
    if (eshuju.wryListOpt.includes('涉氮企业')) {
      eshuju.wryAllList.sdqy.setVisible(true)
    } else {
      eshuju.wryAllList.sdqy.setVisible(false)
    }

    // 闸坝
    if (eshuju.wryListOpt.includes('闸坝')) {
      eshuju.wryAllList.zb.setVisible(true)
    } else {
      eshuju.wryAllList.zb.setVisible(false)
    }
    // 人工湿地
    if (eshuju.wryListOpt.includes('人工湿地')) {
      eshuju.wryAllList.rgsd.setVisible(true)
    } else {
      eshuju.wryAllList.rgsd.setVisible(false)
    }

    // 河湖缓冲带
    if (eshuju.wryListOpt.includes('河湖缓冲带')) {
      eshuju.wryAllList.hhhcd.setVisible(true)
    } else {
      eshuju.wryAllList.hhhcd.setVisible(false)
    }
  }
}

export function bdhXz() {
  if (eshuju.bdListOpt) {
    if (eshuju.wryListOpt.includes('地表水断面')) {
      eshuju.bdhAllList.dbshui.setVisible(true)
    } else {
      eshuju.bdhAllList.dbshui.setVisible(false)
    }
    if (eshuju.wryListOpt.includes('自动站')) {
      eshuju.bdhAllList.dbsszzdz.setVisible(true)
    } else {
      eshuju.bdhAllList.dbsszzdz.setVisible(false)
    }
    if (eshuju.wryListOpt.includes('污水处理厂')) {
      eshuju.bdhAllList.wsccc.setVisible(true)
    } else {
      eshuju.bdhAllList.wsccc.setVisible(false)
    }
    if (eshuju.wryListOpt.includes('工业企业')) {
      eshuju.bdhAllList.gyqy.setVisible(true)
    } else {
      eshuju.bdhAllList.gyqy.setVisible(false)
    }
    if (eshuju.wryListOpt.includes('规上畜禽养殖')) {
      eshuju.bdhAllList.xq1yz.setVisible(true)
    } else {
      eshuju.bdhAllList.xq1yz.setVisible(false)
    }
    if (eshuju.wryListOpt.includes('规下畜禽养殖')) {
      eshuju.bdhAllList.xq2yz.setVisible(true)
    } else {
      eshuju.bdhAllList.xq2yz.setVisible(false)
    }
    if (eshuju.wryListOpt.includes('水产养殖')) {
      eshuju.bdhAllList.scyz.setVisible(true)
    } else {
      eshuju.bdhAllList.scyz.setVisible(false)
    }
    if (eshuju.wryListOpt.includes('入河排污口')) {
      eshuju.bdhAllList.rhpwk.setVisible(true)
    } else {
      eshuju.bdhAllList.rhpwk.setVisible(false)
    }
    if (eshuju.wryListOpt.includes('入海排污口')) {
      eshuju.bdhAllList.bdh_rhpwk.setVisible(true)
    } else {
      eshuju.bdhAllList.bdh_rhpwk.setVisible(false)
    }
    if (eshuju.wryListOpt.includes('傍河村庄')) {
      eshuju.bdhAllList.pwcz.setVisible(true)
    } else {
      eshuju.bdhAllList.pwcz.setVisible(false)
    }
    if (eshuju.wryListOpt.includes('涉海风险源')) {
      eshuju.bdhAllList.bdh_shfxy.setVisible(true)
    } else {
      eshuju.bdhAllList.bdh_shfxy.setVisible(false)
    }
  }
}

export function bdhJahyXz() {
  if (eshuju.bdh_jahy_ListOpt) {
    if (eshuju.bdh_jahy_ListOpt.includes('近岸海域')) {
      eshuju.bdhJahyAllList.jahy?.setVisible(true)
    } else {
      eshuju.bdhJahyAllList.jahy?.setVisible(false)
    }

    if (eshuju.bdh_jahy_ListOpt.includes('海水浴场')) {
      eshuju.bdhJahyAllList.hsyc?.setVisible(true)
    } else {
      eshuju.bdhJahyAllList.hsyc?.setVisible(false)
    }

    if (eshuju.bdh_jahy_ListOpt.includes('浴场外围海域')) {
      if (eshuju.bdhJahyAllList.ycwwhy.length != 0) {
        for (var i = 0; i < eshuju.bdhJahyAllList.ycwwhy.length; i++) {
          eshuju.bdhJahyAllList.ycwwhy[i]?.setVisible(true)
        }
      }
    } else {
      if (eshuju.bdhJahyAllList.ycwwhy.length != 0) {
        for (var i = 0; i < eshuju.bdhJahyAllList.ycwwhy.length; i++) {
          eshuju.bdhJahyAllList.ycwwhy[i]?.setVisible(false)
        }
      }
    }

    if (eshuju.bdh_jahy_ListOpt.includes('秦皇岛港海域')) {
      eshuju.bdhJahyAllList.qhdghy?.setVisible(true)
    } else {
      eshuju.bdhJahyAllList.qhdghy?.setVisible(false)
    }

    if (eshuju.bdh_jahy_ListOpt.includes('重点河口海域')) {
      eshuju.bdhJahyAllList.zdhkhy?.setVisible(true)
    } else {
      eshuju.bdhJahyAllList.zdhkhy?.setVisible(false)
    }

    if (eshuju.bdh_jahy_ListOpt.includes('浴场和周边海域全项监测')) {
      eshuju.bdhJahyAllList.ychzbhxqxjc?.setVisible(true)
    } else {
      eshuju.bdhJahyAllList.ychzbhxqxjc?.setVisible(false)
    }
  }
}

export function sztpinkzhi(mc, map, tclx, mj) {
  closeInfoWin()
  closesInfoWin()
  xuanze = mc
  mingzi = ''
  selection = {}
  zhongxin = []
  if (selectionhlLayer != null) {
    selectionhlLayer.changed()
    if (mc != undefined && mc != '') {
      xuanze = mc

      var data = jlxxheji[mc]
      if (data != undefined) {
        mj = data.Shape_Area
      }
      getnumzong(mc, '', '', '', tclx, mj)
    }
  }
}

// 切换北戴河河流
export function initqielk(map, lei) {
  if (lei != leinames) {
    if (hltuceng != null) {
      map.removeLayer(hltuceng)
    }
    if (selectionhlLayer != null) {
      map.removeLayer(selectionhlLayer)
    }
    if (hlmtuceng != null) {
      map.removeLayer(hlmtuceng)
    }
    hltuceng = null
    selectionhlLayer = null
    hlmtuceng = null
    leinames = lei
    initwaterlk(map)
  }
}

/* 河流*/
export function initwaterlk(map) {
  if (hltuceng == null) {
    // 河流线
    mingzi = ''
    var url = 'http://10.122.2.138:8090/iserver/services/map-mvt-SXHYB/restjsr/v1/vectortile/maps/SXHY_B/style.json'
    var format = new ol.format.MVT({
      featureClass: ol.Feature
    })
    var style = new ol.supermap.MapboxStyles({
      style: url, map: map
    })
    style.on('styleloaded', function() {
      hltuceng = new ol.layer.VectorTile({
        className: 'hlxians', zIndex: 4, declutter: true, source: new ol.source.VectorTileSuperMapRest({
          className: 'hllist',
          style: url,
          projection: 'EPSG:4326',
          source: 'SXHY_B',
          format: format,
          resolutions: getLods()[0]
        }), style: style.getStyleFunction()
      })
      map.addLayer(hltuceng)
      selectionhlLayer = new ol.layer.VectorTile({
        zIndex: 4, map: map, renderMode: 'vector', source: hltuceng.getSource(), style: function(feature) {
          const res = feature.getProperties()
          var mc = feature.get('NAME') || feature.get('Name') || res['名称']
          if (mc != undefined) {
          }
          if (mc in selection) {
            return new ol.style.Style({
              stroke: new ol.style.Stroke({
                color: 'rgb(50,255,255)', width: 5
              })
            })
          }
          if (xuanze != '') {
            if (mc == xuanze) {
              //
              var zhi = res.geometry.getExtent()
              if (zhongxin.length == 0) {
                zhongxin.push(zhi)
                map.getView().fit(zhongxin[0], map.getSize())// 居中到geometry视野中
                var zoom = map.getView().getZoom()
                if (mc == '滦河' || mc == '陡河') {
                  map.getView().setZoom(8)
                } else {
                  map.getView().setZoom(11)
                }
              }

              return new ol.style.Style({
                stroke: new ol.style.Stroke({
                  color: 'rgb(37,234,48)', width: 5
                })
              })
            }
          }
        }
      })
      // 清除监听
      if (heliuListener) {
        ol.Observable.unByKey(heliuListener)
      }
      // 河流点击事件
      heliuListener = map.on('click', function(e) {
        var features = map.getFeaturesAtPixel(e.pixel)
        if (features != null) {
          if (!features.length) {
            selection = {}
            selectionhlLayer.changed()
            return
          }
          const feature = features[0]
          if (!feature) {
            return
          }
          closesInfoWin()
          const res = feature.getProperties()
          // console.log(res)
          if (res.layer) {
            if ((feature.get('NAME') != undefined || feature.get('Name') != undefined || res['名称'] != undefined) && res.layer.includes('@SX') && res.leixing != '湾区划分') {
              var mc = feature.get('NAME') || feature.get('Name') || res['名称']
              if (mc == undefined) {
                mc = res.Name
              }
              selection = {}
              selection[mc] = feature
              selectionhlLayer.changed()
              mingzi = mc
              if (mc != undefined) {
                getnumzong(mc, e, feature)
              }
            }
          }
          if (res.leixing === '收水范围') {
            const item = {
              name: res['名称'], anotherName: res.anotherName
            }
            eshuju.$refs.mapPopBox.mapPopDialog = true
            eshuju.$refs.mapPopBox.mapPopInfo = item
            eshuju.$refs.mapPopBox.mapPopType = 'rhhl_ssfw' // 入海河流，收水范围
          }
        }
      })
      if (hltuceng != null) {
        hltuceng.setVisible(true)
      }
      if (selectionhlLayer != null) {
        selectionhlLayer.setVisible(true)
      }
      if (hlmtuceng != null) {
        hlmtuceng.setVisible(true)
      }
    })
  }
  if (hlmtuceng == null) {
    // 河流湖库名称
    hlmtuceng = new ol.layer.Tile({
      opacity: 1, className: 'hlwbs', zIndex: 5, source: new ol.source.WMTS({
        url: 'http://10.122.2.138:8090/iserver/services/map-agscache-SXZJTZ/wmts100',
        layer: 'SXZJTZ',
        matrixSet: 'Custom_SXZJTZ',
        style: 'default',
        version: '1.0.0',
        format: 'image/png',
        wrapX: true,
        tileGrid: new ol.tilegrid.WMTS({
          tileSize: [256, 256],
          origin: [84.29215628686313, 50.8591431420287],
          extent: [84.29215628686313, 17.07131828480567, 129.34258942982717, 50.8591431420287],
          resolutions: getLods()[0],
          matrixIds: getLods()[1]
        })
      })
    })
    map.addLayer(hlmtuceng)
  }
  if (zhujituceng == null) {
    zhujituceng = new ol.layer.Tile({
      opacity: 1, className: 'hlwbs', zIndex: 6, source: new ol.source.WMTS({
        url: 'http://10.122.2.138:8090/iserver/services/map-agscache-SXqhdzjZL0215/wmts100',
        layer: 'SX_qhd_zj_ZL0215',
        matrixSet: 'Custom_SX_qhd_zj_ZL0215',
        style: 'default',
        version: '1.0.0',
        format: 'image/png',
        wrapX: true,
        tileGrid: new ol.tilegrid.WMTS({
          tileSize: [256, 256],
          origin: [118.62351369315854, 41.45900850388381],
          extent: [118.62351369315854, 39.2660972409106, 120.81642495613175, 41.45900850388381],
          resolutions: getLods()[0],
          matrixIds: getLods()[1]
        })
      })
    })
    map.addLayer(zhujituceng)
    zhujituceng.setVisible(false)
  }
}

export function initfenzhi1(map, dataz, mingzis) {
  if (xijietuceng != null) {
    map.removeLayer(xijietuceng)
  }
  // mingzis='花场峪河'
  const url = 'http://10.122.2.138:8090/iserver/services/data-HL_gz/wfs100/utf-8?service=WFS&version=1.1.0&request=GetFeature&typename=HL_gz:SX_hy&outputFormat=gml2&srsname=EPSG:4326'
  axios.get(url).then(res => {
    var features = new ol.format.GML2().readFeatures(res.data, {
      featureProjection: map.getView().getProjection(), dataProjection: map.getView().getProjection()
    })
    if (features.length) {
      var jihezu = []
      for (var i = 0; i < features.length; i++) {
        var datas = features[i].getProperties()
        // console.log(''+datas['别名'])
        var lens = mingzis.length
        var bieming_ = datas['别名'].substring(0, lens)
        if (bieming_ == mingzis) {
          features[i]['sfzl'] = false
          jihezu.push(features[i])
        } else {
          if (datas['T1级河流'] != undefined) {
            if (datas['T1级河流'].substring(0, lens) == mingzis && dataz.level == 1 && dataz.list.length != 0) {
              features[i]['sfzl'] = true
              jihezu.push(features[i])
            }
          }
          if (datas['T2级河流'] != undefined) {
            if (datas['T2级河流'].substring(0, lens) == mingzis && dataz.level == 2 && dataz.list.length != 0) {
              features[i]['sfzl'] = true
              jihezu.push(features[i])
            }
          }
          if (datas['T3级河流'] != undefined) {
            if (datas['T3级河流'].substring(0, lens) == mingzis && dataz.level == 3 && dataz.list.length != 0) {
              features[i]['sfzl'] = true
              jihezu.push(features[i])
            }
          }
          if (datas['T4级河流'] != undefined) {
            if (datas['T4级河流'].substring(0, lens) == mingzis && dataz.level == 4 && dataz.list.length != 0) {
              features[i]['sfzl'] = true
              jihezu.push(features[i])
            }
          }
          if (datas['T5级河流'] != undefined) {
            if (datas['T5级河流'].substring(0, lens) == mingzis && dataz.level == 5 && dataz.list.length != 0) {
              features[i]['sfzl'] = true
              jihezu.push(features[i])
            }
          }
          if (datas['T6级河流'] != undefined) {
            if (datas['T6级河流'].substring(0, lens) == mingzis && dataz.level == 6 && dataz.list.length != 0) {
              features[i]['sfzl'] = true
              jihezu.push(features[i])
            }
          }
        }
      }
      features = jihezu
      features.forEach(feature => {
        var datas = feature.getProperties()
        feature.setProperties({
          V: feature['V'], leixing: 'erjixiangxi', type: 'mianlist'
        })
        var flatCoordinates = datas.the_geom.flatCoordinates
        for (var i = 0; i < flatCoordinates.length; i = i + 3) {
          var a = flatCoordinates[i]
          flatCoordinates[i] = flatCoordinates[i + 1]
          flatCoordinates[i + 1] = a
        }
      })
      console.log(features)
      xijietuceng = new ol.layer.Vector({
        zIndex: 4, source: new ol.source.Vector({ features }), style: function(feature) {
          // console.log(feature)
          if (feature['sfzl']) {
            return new ol.style.Style({
              stroke: new ol.style.Stroke({
                color: 'rgb(50,255,255)', width: 3
              })
            })
          } else {
            return new ol.style.Style({
              stroke: new ol.style.Stroke({
                color: 'rgb(50,255,255)', width: 5
              })
            })
          }
        }

      })
      map.addLayer(xijietuceng)

      if (features.length != 0) {
        var zhi = ol.extent.boundingExtent(features[0].getGeometry().getCoordinates()[0]) // 获取一个坐标数组的边界，格式为[minx,miny,maxx,maxy]
        var xinzhi = zhi
        if (features.length == 1) {
          if (zhi[1] > zhi[0]) {
            xinzhi = [zhi[1], zhi[0], zhi[3], zhi[2]]
          }
        } else {
          if (zhi[1] > zhi[0]) {
            xinzhi = [zhi[1], zhi[0], zhi[3], zhi[2]]
          }
        }
        var datas = features[0].getProperties()
        map.getView().fit(xinzhi, map.getSize())// 居中到geometry视野中
        if (datas['别名'] == '滦河' || datas['别名'] == '陡河') {
          map.getView().setZoom(8)
        } else {
          map.getView().setZoom(11)
        }
      }

      // 清除监听
      if (heliueListener) {
        ol.Observable.unByKey(heliueListener)
      }
      // 河流点击事件
      heliueListener = map.on('click', function(e) {
        var features = map.getFeaturesAtPixel(e.pixel)
        if (features != null) {
          if (!features.length) {
            selection = {}
            selectionhlLayer.changed()
            return
          }
          const feature = features[0]
          if (!feature) {
            return
          }
          closesInfoWin()
          const res = feature.getProperties()
          console.log(res)
          console.log(res['V'])
          var zhis1 = res['V']
          if (zhis1 != undefined) {
            var zhis2 = res['V'].toString()
            var zhi = zhis2.includes('HL_gz.SX_hy')
          } else {
            var zhi = false
          }
          if (zhi) {
            if (feature.get('NAME') != undefined || feature.get('Name') != undefined || res['别名'] != undefined) {
              var mc = feature.get('NAME') || feature.get('Name') || res['别名']
              if (mc == undefined) {
                mc = res.Name
              }
              selection = {}
              selection[mc] = feature
              selectionhlLayer.changed()
              mingzi = mc
              if (mc != undefined) {
                getnumzong(mc, e, feature)
              }
            }
          }
          if (res.leixing === '收水范围') {
            const item = {
              name: res['别名'], anotherName: res.anotherName
            }
            eshuju.$refs.mapPopBox.mapPopDialog = true
            eshuju.$refs.mapPopBox.mapPopInfo = item
            eshuju.$refs.mapPopBox.mapPopType = 'rhhl_ssfw' // 入海河流，收水范围
          }
        }
      })
    }
  })
}

export function initfenzhi2(map) {
  if (xijietuceng != null) {
    map.removeLayer(xijietuceng)
  }
  const url = 'http://10.122.2.138:8090/iserver/services/data-HL_gz/wfs100/utf-8?service=WFS&version=1.1.0&request=GetFeature&typename=HL_gz:HK_hy&outputFormat=gml2&srsname=EPSG:4326'
  axios.get(url).then(res => {
    var features = new ol.format.GML2().readFeatures(res.data, {
      featureProjection: map.getView().getProjection(), dataProjection: map.getView().getProjection()
    })
    // console.log(features)
    if (features.length) {
      var jihezu = []
      for (var i = 0; i < features.length; i++) {
        var datas = features[i].getProperties
        if (datas['名称'] == mingzis) {
          jihezu.push(features[i])
        }
      }
      features = jihezu
      features.forEach(feature => {
        var datas = feature.getProperties()
        feature.setProperties({
          V: feature['V'], type: 'mianlist'
        })
        var flatCoordinates = datas.the_geom.flatCoordinates
        for (var i = 0; i < flatCoordinates.length; i = i + 3) {
          var a = flatCoordinates[i]
          flatCoordinates[i] = flatCoordinates[i + 1]
          flatCoordinates[i + 1] = a
        }
      })
      xijietuceng = new ol.layer.Vector({
        source: new ol.source.Vector({ features }), style: new ol.style.Style({
          fill: new ol.style.Fill({
            color: 'red', width: 1.5
          })
        })
      })
      map.addLayer(xijietuceng)
    }
  })
}

/* 河流面*/
export function initwatermlk(map) {
  if (hlstuceng == null) {
    var url = 'http://10.122.2.138:8090/iserver/services/map-mvt-HL84HL84/restjsr/v1/vectortile/maps/HL84@HL84/style.json'
    var format = new ol.format.MVT({
      featureClass: ol.Feature
    })
    hlstuceng = new ol.layer.VectorTile({
      className: 'hlxians', zIndex: 4, declutter: true, source: new ol.source.VectorTileSuperMapRest({
        className: 'hllist',
        style: url,
        projection: 'EPSG:4326',
        source: 'HL84@HL84',
        format: format,
        resolutions: getLods()[0]
      }), style: new ol.style.Style({
        fill: new ol.style.Fill({
          color: 'rgb(0,255,255)'
        })
      })
    })
    map.addLayer(hlstuceng)
    selectionmLayer = new ol.layer.VectorTile({
      zIndex: 4, map: map, renderMode: 'vector', source: hlstuceng.getSource(), style: function(feature) {
        if (feature.getId() in selecmtion) {
          return new ol.style.Style({
            fill: new ol.style.Fill({
              color: 'rgb(37,234,48)'
            })
          })
        }
      }
    })
    // 清除监听
    if (heliusListener) {
      ol.Observable.unByKey(heliusListener)
    }
    heliusListener = map.on('click', function(e) {
      var features = map.getFeaturesAtPixel(e.pixel)
      if (features != null) {
        if (!features.length) {
          selecmtion = {}
          selectionmLayer.changed()
          return
        }
        const feature = features[0]
        if (!feature) {
          return
        }
        const fid = feature.getId()
        if (fid == undefined) {
          return
        }
        closesInfoWin()
        selecmtion = {}
        selecmtion[fid] = feature
        selectionmLayer.changed()
        const res = feature.getProperties()
      }
    })
    if (hlstuceng != null) {
      hlstuceng.setVisible(true)
    }
    if (selectionmLayer != null) {
      selectionmLayer.setVisible(true)
    }
  }
}

/* 区域名称*/
export function initquyu(map) {
  if (quyutuceng == null) {
    var url = 'http://10.122.2.138:8090/iserver/services/map-mvt-WDQY/restjsr/v1/vectortile/maps/WDQY/style.json'
    var format = new ol.format.MVT({
      featureClass: ol.Feature
    })
    quyutuceng = new ol.layer.VectorTile({
      className: 'qyxians', zIndex: 3, declutter: true, source: new ol.source.VectorTileSuperMapRest({
        className: 'qylist',
        style: url,
        projection: 'EPSG:4326',
        source: 'WDQY',
        format: format,
        resolutions: getLods()[0]
      }), style: function(feature) {
        const res = feature.getProperties()
        var du1 = '0.3'
        var beijys = 'rgba(12, 67, 121,' + du1 + ')'
        if (res.QYMC == '环渤海') {
          beijys = 'rgba(255,220,200,' + du1 + ')'
        } else if (res.QYMC == '京津水源涵养区') {
          beijys = 'rgba(220,220,255,' + du1 + ')'
        } else if (res.QYMC == '白洋淀流域') {
          beijys = 'rgba(200,255,200,' + du1 + ')'
        } else if (res.QYMC == '冀中南') {
          beijys = 'rgba(200,220,255,' + du1 + ')'
        } else if (res.QYMC == '大运河') {
          beijys = 'rgba(255,200,200,' + du1 + ')'
        }
        return new ol.style.Style({
          fill: new ol.style.Fill({
            color: beijys
          }), stroke: new ol.style.Stroke({
            color: 'rgb(32,123,240)', width: 1
          }), text: new ol.style.Text({
            fill: new ol.style.Fill({
              color: '#fff'
            }), text: res.QYMC, font: '15px sans-serif'
          })
        })
      }
    })
    map.addLayer(quyutuceng)
    selectionqyLayer = new ol.layer.VectorTile({
      zIndex: 3, map: map, renderMode: 'vector', source: quyutuceng.getSource(), style: function(feature) {
        const res = feature.getProperties()
        var mc = feature.get('QYMC')
        if (mc in selecqytion) {
          return yangs(res)
        }
        if (qyname != '') {
          if (mc == qyname) {
            var zhi = res.geometry.getExtent()
            if (zhongxin.length == 0) {
              zhongxin.push(zhi)
              map.getView().fit(zhongxin[0], map.getSize())// 居中到geometry视野中
              map.getView().setZoom(7)
            }
            return yangs(res)
          }
        }
      }
    })

    function yangs(res) {
      var du1 = '0.7'
      if (yao1tuceng != null) {
        if (yao1tuceng.getVisible()) {
          du1 = '0'
        }
      }
      var beijys = 'rgba(12, 67, 121,' + du1 + ')'
      if (res.QYMC == '环渤海') {
        beijys = 'rgba(255,220,200,' + du1 + ')'
      } else if (res.QYMC == '京津水源涵养区') {
        beijys = 'rgba(220,220,255,' + du1 + ')'
      } else if (res.QYMC == '白洋淀流域') {
        beijys = 'rgba(200,255,200,' + du1 + ')'
      } else if (res.QYMC == '冀中南') {
        beijys = 'rgba(200,220,255,' + du1 + ')'
      } else if (res.QYMC == '大运河') {
        beijys = 'rgba(255,200,200,' + du1 + ')'
      }
      return new ol.style.Style({
        fill: new ol.style.Fill({
          color: beijys
        }), stroke: new ol.style.Stroke({
          color: 'rgb(32,123,240)', width: 5
        }), text: new ol.style.Text({
          fill: new ol.style.Fill({
            color: '#fff'
          }), text: res.QYMC, font: '15px sans-serif'
        })
      })
    }

    // 清除监听
    if (quyuListener) {
      ol.Observable.unByKey(quyuListener)
    }
    quyuListener = map.on('click', function(e) {
      var features = map.getFeaturesAtPixel(e.pixel)
      if (features != null) {
        if (!features.length) {
          selecqytion = {}
          selectionqyLayer.changed()
          return
        }
        const feature = features[0]
        if (!feature) {
          return
        }
        closesInfoWin()
        const res = feature.getProperties()
        // console.log(res)
        if (res.QYMC != undefined) {
          var mc = res.QYMC
          selecqytion = {}
          selecqytion[mc] = feature
          selectionqyLayer.changed()
          qyname = mc
          // getqynumzong(mc,e,'区域','qyxx')
        }
      }
    })
    quyutuceng.setVisible(false)
    selectionqyLayer.setVisible(false)
  }
}

/* 水系名称*/
export function initshuixi(map) {
  if (shuixituceng == null) {
    var url = 'http://10.122.2.138:8090/iserver/services/map-mvt-BDSX/restjsr/v1/vectortile/maps/BDSX/style.json'
    var format = new ol.format.MVT({
      featureClass: ol.Feature
    })
    shuixituceng = new ol.layer.VectorTile({
      className: 'sxxians', zIndex: 3, declutter: true, source: new ol.source.VectorTileSuperMapRest({
        className: 'sxlist',
        style: url,
        projection: 'EPSG:4326',
        source: 'BDSX',
        format: format,
        resolutions: getLods()[0]
      }), style: function(feature) {
        const res = feature.getProperties()
        var du1 = '0.3'
        var beijys = 'rgba(12, 67, 121,' + du1 + ')'
        if (shuiqie(res['名称']) == '辽河') {
          beijys = 'rgba(255,220,200,' + du1 + ')'
        } else if (shuiqie(res['名称']) == '永定河') {
          beijys = 'rgba(220,220,255,' + du1 + ')'
        } else if (shuiqie(res['名称']) == '滦河及冀东沿海') {
          beijys = 'rgba(200,255,200,' + du1 + ')'
        } else if (shuiqie(res['名称']) == '大清河') {
          beijys = 'rgba(200,220,255,' + du1 + ')'
        } else if (shuiqie(res['名称']) == '子牙河') {
          beijys = 'rgba(255,200,200,' + du1 + ')'
        } else if (shuiqie(res['名称']) == '漳卫南运河') {
          beijys = 'rgba(220,180,255,' + du1 + ')'
        } else if (shuiqie(res['名称']) == '北三河') {
          beijys = 'rgba(150,200,220,' + du1 + ')'
        } else if (shuiqie(res['名称']) == '黑龙港运东') {
          beijys = 'rgba(150,150,210,' + du1 + ')'
        } else if (shuiqie(res['名称']) == '内蒙古高原内流区') {
          beijys = 'rgba(255,255,200,' + du1 + ')'
        }
        return new ol.style.Style({
          fill: new ol.style.Fill({
            color: beijys
          }), stroke: new ol.style.Stroke({
            color: 'rgb(32,123,240)', width: 1
          }), text: new ol.style.Text({
            fill: new ol.style.Fill({
              color: '#fff'
            }), text: shuiqie(res['名称']), font: '15px sans-serif'
          })
        })
      }
    })
    map.addLayer(shuixituceng)
    selectionsxLayer = new ol.layer.VectorTile({
      zIndex: 3, map: map, renderMode: 'vector', source: shuixituceng.getSource(), style: function(feature) {
        const res = feature.getProperties()
        var mc = shuiqie(res['名称'])
        if (mc in selecsxtion) {
          return yangs(res)
        }
        if (sxname != '') {
          if (shuiqie(res['名称']) == sxname) {
            var zhi = res.geometry.getExtent()
            if (zhongxin.length == 0) {
              zhongxin.push(zhi)
              map.getView().fit(zhongxin[0], map.getSize())// 居中到geometry视野中
              map.getView().setZoom(7)
            }
            return yangs(res)
          }
        }
      }
    })

    function yangs(res) {
      var du1 = '0.7'
      if (yao1tuceng != null) {
        if (yao1tuceng.getVisible()) {
          du1 = '0'
        }
      }
      var beijys = 'rgba(12, 67, 121,' + du1 + ')'
      if (shuiqie(res['名称']) == '辽河') {
        beijys = 'rgba(255,220,200,' + du1 + ')'
      } else if (shuiqie(res['名称']) == '永定河') {
        beijys = 'rgba(220,220,255,' + du1 + ')'
      } else if (shuiqie(res['名称']) == '滦河及冀东沿海') {
        beijys = 'rgba(200,255,200,' + du1 + ')'
      } else if (shuiqie(res['名称']) == '大清河') {
        beijys = 'rgba(200,220,255,' + du1 + ')'
      } else if (shuiqie(res['名称']) == '子牙河') {
        beijys = 'rgba(255,200,200,' + du1 + ')'
      } else if (shuiqie(res['名称']) == '漳卫南运河') {
        beijys = 'rgba(220,180,255,' + du1 + ')'
      } else if (shuiqie(res['名称']) == '北三河') {
        beijys = 'rgba(150,200,220,' + du1 + ')'
      } else if (shuiqie(res['名称']) == '黑龙港运东') {
        beijys = 'rgba(150,150,210,' + du1 + ')'
      } else if (shuiqie(res['名称']) == '内蒙古高原内流区') {
        beijys = 'rgba(255,255,200,' + du1 + ')'
      }
      return new ol.style.Style({
        fill: new ol.style.Fill({
          color: beijys
        }), stroke: new ol.style.Stroke({
          color: 'rgb(255,255,255)', width: 5
        }), text: new ol.style.Text({
          fill: new ol.style.Fill({
            color: '#fff'
          }), text: shuiqie(res['名称']), font: '15px sans-serif'
        })
      })
    }

    // 清除监听
    if (shuixiListener) {
      ol.Observable.unByKey(shuixiListener)
    }
    shuixiListener = map.on('click', function(e) {
      var features = map.getFeaturesAtPixel(e.pixel)
      if (features != null) {
        if (!features.length) {
          selecsxtion = {}
          selectionsxLayer.changed()
          return
        }
        const feature = features[0]
        if (!feature) {
          return
        }
        closesInfoWin()
        const res = feature.getProperties()
        // console.log(res)
        if (res['名称'] != undefined) {
          var mc = shuiqie(res['名称'])
          selecsxtion = {}
          selecsxtion[mc] = feature
          selectionsxLayer.changed()
          sxname = mc
          // getqynumzong(mc,e,'水系','sxxx')
        }
      }
    })
    shuixituceng.setVisible(false)
    selectionsxLayer.setVisible(false)
  }
}

export async function initguanwang(sfxs) {
  var map = xmaps
  const { status, data } = await getGwGisInfo({})
  if (status === 0 && data) {
    data.forEach((v, i) => {
      var zhi1 = v['sj']['monthValue']
      zhi1 = zhi1 < 10 ? '0' + zhi1 : zhi1
      var zhi2 = v['sj']['dayOfMonth']
      zhi2 = zhi2 < 10 ? '0' + zhi2 : zhi2
      var nian = v['sj']['year']
      v['lx'] = '管网问题'
      v['leixing'] = '管网问题点位'
      v['zhi1'] = zhi1
      v['zhi2'] = zhi2
      v['nian'] = nian
    })
    if (ru_hai3 == null) {
      addPoint(map, data, 'gwxx', false, false, false, 'qk')
      ru_hai3.setVisible(sfxs)
      // 清除监听
      if (guan_Listener) {
        ol.Observable.unByKey(guan_Listener)
      }
      // 添加监听
      guan_Listener = map.on('click', function(evt) {
        // 处理点击事件
        var feature = map.forEachFeatureAtPixel(evt.pixel, function(feature) {
          return feature
        }, { hitTolerance: 10 })
        closeInfoWin()
        if (feature) {
          if (feature['A']['leixing'] == '管网问题点位' || feature['A']['leixing'] == '管网问题') {
            const item = feature['A']
            eshuju.$refs.mapPopBox.mapPopDialog = true
            eshuju.$refs.mapPopBox.mapPopInfo = item
            eshuju.$refs.mapPopBox.mapPopType = 'guanwangs'
          }
        }
      })
    }
  }
}

export function qiehuanheliuxm(maps, lei) {
  if (hltuceng != null) {
    hltuceng.setVisible(false)
  }
  if (selectionhlLayer != null) {
    selectionhlLayer.setVisible(false)
  }
  if (hlstuceng != null) {
    hlstuceng.setVisible(false)
  }
  if (selectionmLayer != null) {
    selectionmLayer.setVisible(false)
  }
  if (lei == 1) {
    if (hltuceng != null) {
      hltuceng.setVisible(true)
    }
    if (selectionhlLayer != null) {
      selectionhlLayer.setVisible(true)
    }
  } else {
    if (hlstuceng == null) {
      initwatermlk(maps)
    } else {
      if (hlstuceng != null) {
        hlstuceng.setVisible(true)
      }
      if (selectionmLayer != null) {
        selectionmLayer.setVisible(true)
      }
    }
  }
}

export function highquyu(map, name) {
  if (stationActive == 5) {
    mapAndCenter(116.283976, 39.556141, map, 7)
  } else {
    mapAndCenter(119.41010268430291, 39.74080657918234, map, 10.23)
  }
  selecqytion = {}
  selecsxtion = {}
  zhongxin = []
  qyname = name
  sxname = ''
  if (selectionqyLayer != null) {
    selectionqyLayer.changed()
  }
}

export function highshuixi(map, name) {
  if (stationActive == 5) {
    mapAndCenter(116.283976, 39.556141, map, 7)
  } else {
    mapAndCenter(119.41010268430291, 39.74080657918234, map, 10.23)
  }
  selecqytion = {}
  selecsxtion = {}
  zhongxin = []
  qyname = ''
  sxname = name
  if (selectionsxLayer != null) {
    selectionsxLayer.changed()
  }
}

export function shuiqie(name) {
  switch (name) {
    case '辽河水系':
      return '辽河'
      break
    case '永定河水系':
      return '永定河'
      break
    case '滦河及冀东沿海诸河水系':
      return '滦河及冀东沿海'
      break
    case '大清河水系':
      return '大清河'
      break
    case '子牙河水系':
      return '子牙河'
      break
    case '漳卫河水系':
      return '漳卫南运河'
      break
    case '北三河水系':
      return '北三河'
      break
    case '黑龙港及运东地区诸河水系':
      return '黑龙港运东'
      break
    default:
      return '内蒙古高原内流区'
      break
  }
}

export function dgaoliang(lng, lat) {
  mapAndCenter(lng, lat, xmaps, 9)
}

export function kongzhitc(hll, type) {
  var sf1 = false
  var sf2 = false
  var sf3 = false
  $('#heliupup').hide()
  qyname = ''
  sxname = ''
  selecqytion = {}
  selecsxtion = {}
  if (type == 1) {
    sf1 = true
  } else if (type == 2) {
    sf2 = true
  } else if (type == 3) {
    sf3 = true
  } else {
    sf1 = true
  }
  if (hltuceng != null) {
    hltuceng.setVisible(hll)
  }
  if (selectionhlLayer != null) {
    selectionhlLayer.setVisible(hll)
  }
  if (hlmtuceng != null) {
    hlmtuceng.setVisible(hll)
  }
  // if(opshuzu.bianjie.length!=0){
  if (type == '' && sf1) {
    if (shengtuceng != null) {
      shengtuceng.setVisible(true)
    }
    if (dstuceng != null) {
      dstuceng.setVisible(false)
    }
    if (dsselections != null) {
      dsselections.setVisible(false)
    }
  } else {
    if (shengtuceng != null) {
      shengtuceng.setVisible(false)
    }
    if (dstuceng != null) {
      dstuceng.setVisible(sf1)
    }
    if (dsselections != null) {
      dsselections.setVisible(sf1)
    }
  }
  if (quyutuceng != null) {
    quyutuceng.setVisible(sf2)
  }
  if (selectionqyLayer != null) {
    selectionqyLayer.setVisible(sf2)
    selectionqyLayer.changed()
  }
  if (shuixituceng != null) {
    shuixituceng.setVisible(sf3)
  }
  if (selectionsxLayer != null) {
    selectionsxLayer.setVisible(sf3)
    selectionsxLayer.changed()
  }
}

export function hlzhitc(sf, radios, kong, zj) {
  if (kong && kong == 'kong') {
    selecmtion = {}
  }
  if (zj && zj == 'zj') {
    if (zhujituceng != null) {
      zhujituceng.setVisible(sf)
    }
    return
  }
  if (radios == 1) {
    if (hltuceng != null) {
      hltuceng.setVisible(sf)
    }
    if (selectionhlLayer != null) {
      selectionhlLayer.setVisible(sf)
    }
    if (hlmtuceng != null) {
      hlmtuceng.setVisible(sf)
    }
    if (hlstuceng != null) {
      hlstuceng.setVisible(false)
    }
    if (selectionmLayer != null) {
      selectionmLayer.setVisible(false)
    }
    if (sf) {
      if (hlstuceng != null) {
        hlstuceng.setVisible(!sf)
      }
      if (selectionmLayer != null) {
        selectionmLayer.setVisible(!sf)
      }
    } else {
      if (hlstuceng != null) {
        hlstuceng.setVisible(sf)
      }
      if (selectionmLayer != null) {
        selectionmLayer.setVisible(sf)
      }
    }
  } else {
    if (hlstuceng != null) {
      hlstuceng.setVisible(sf)
    }
    if (selectionmLayer != null) {
      selectionmLayer.setVisible(sf)
    }
    if (hlmtuceng != null) {
      hlmtuceng.setVisible(sf)
    }
    if (sf) {
      if (hltuceng != null) {
        hltuceng.setVisible(!sf)
      }
      if (selectionhlLayer != null) {
        selectionhlLayer.setVisible(!sf)
      }
    } else {
      if (hltuceng != null) {
        hltuceng.setVisible(sf)
      }
      if (selectionhlLayer != null) {
        selectionhlLayer.setVisible(sf)
      }
    }
  }
}

export function ygzhitc(hll) {
  console.log('hll', hll)
  var sf1 = false
  var sf2 = false
  if (hll == 1) {
    sf1 = true
  }
  if (hll == 2) {
    sf2 = true
  }
  if (yao1tuceng != null) {
    yao1tuceng.setVisible(sf1)
  }
  if (yao2tuceng != null) {
    yao2tuceng.setVisible(sf1)
  }
  if (dxtuceng != null) {
    dxtuceng.setVisible(sf2)
  }
}

export function wryjuhe(item) {
  wryjhzhi = item
}

export function changehlname(map, zhi, data) {
  xuanze = zhi
  $('#heliupup').hide()
  mingzi = ''
  selection = {}
  selecmtion = {}
  selecqytion = {}
  selecsxtion = {}
  zhongxin = []
  map.getView().setZoom(7)
  if (selectionhlLayer != null) {
    selectionhlLayer.changed()
    var mc = zhi
    if (mc != undefined) {
      if (data && data != '') {
        getnumzong(mc)
        // getnumzong(mc,'',data.lon,data.lat)
      }
    }
  }
}

export function qingduojihl_(map) {
  if (map != undefined) {
    if (xijietuceng != null) {
      map.removeLayer(xijietuceng)
    }
  }
}

export function changehlxjname(map, data) {
  if (data.riverName != '') {
    zhongxin = []
    map.getView().setZoom(7)
    initfenzhi1(map, data, data.riverName)
  } else {
    if (xijietuceng != null) {
      map.removeLayer(xijietuceng)
    }
  }
}

export function xuanactive(zhi) {
  stationActive = zhi
  if (haiyangtu1 != null) {
    haiyangtu1.setVisible(false)
  }
  if (haiyangtu2 != null) {
    haiyangtu2.setVisible(false)
  }
  if (haiyangtu3 != null) {
    haiyangtu3.setVisible(false)
  }
  if (haiyangtu4 != null) {
    haiyangtu4.setVisible(false)
  }
  if (haiyangtu5 != null) {
    haiyangtu5.setVisible(false)
  }
  if (wqzhuji_wq != null) {
    wqzhuji_wq.setVisible(false)
  }
  if (haiyangtu6 != null) {
    haiyangtu6.setVisible(false)
  }
  if (haitu1 != null) {
    haitu1.setVisible(false)
  }
  if (haitu2 != null) {
    haitu2.setVisible(false)
  }
  if (wqzhuji_ds != null) {
    wqzhuji_ds.setVisible(false)
  }
  if (bdhxiantuceng != null) {
    bdhxiantuceng.setVisible(false)
  }
  $('#heliupup').hide()
  if (stationActive == 0) {
    if (haiyangtu7 != null) {
      haiyangtu7.setVisible(true)
    }
  }
  if (stationActive == 1) {
    if (haiyangtu7 != null) {
      haiyangtu7.setVisible(true)
    }
  }
  if (stationActive == 2) {
    if (haiyangtu7 != null) {
      haiyangtu7.setVisible(true)
    }
  }
  if (stationActive == 3) {
    if (bdhxiantuceng != null) {
      bdhxiantuceng.setVisible(true)
    }
    if (haiyangtu7 != null) {
      haiyangtu7.setVisible(true)
    }
  }
  if (stationActive == 4) {
    if (haiyangtu5 != null) {
      haiyangtu5.setVisible(true)
    }
    if (wqzhuji_wq != null) {
      wqzhuji_wq.setVisible(true)
    }
    if (haiyangtu7 != null) {
      haiyangtu7.setVisible(true)
    }
  }
  xuanze = ''
  mingzi = ''
  selection = {}
  selecmtion = {}
  selecqytion = {}
  selecsxtion = {}
  if (selectionhlLayer != null) {
    selectionhlLayer.changed()
  }
}

export function biaoactive(zhi) {
  DBSType = zhi
  $('#heliupup').hide()
  xuanze = ''
  mingzi = ''
  selection = {}
  selecmtion = {}
  selecqytion = {}
  selecsxtion = {}
  if (selectionhlLayer != null) {
    selectionhlLayer.changed()
  }
}

// 河流悬浮框参数获取
export async function getnumzong(mc, e, feature) {
  var item = {
    name: mc,
    length: 0,
    sl: 0 + '个',
    zs1: 0 + '个',
    zs2: 0 + '个',
    zs3: 0 + '个',
    gkszzdz: 0 + '个',
    skszzdz: 0 + '个',
    rjszzdz: 0 + '个',
    qtszzdz: 0 + '个',
    pwksl: 0 + '个',
    wrysl: 0 + '个',
    wscsl: 0 + '个',
    hldmzs: 0 + '个'
  }
  if (feature) {
    item.length = feature.get('Shape_Length') || feature.get('Shape_Leng') || feature.get('长度')
  }
  const mapHoverData = _setHoverData('hlxx', item)
  const mapHoverBox = _setHoverContent(mapHoverData, 'xx')
  $('#heliupup-content .mapHoverTitle').html(item.name)
  $('#heliupup-content .mapHoverContent').html(mapHoverBox)
  if (e) {
    $('#heliupup').show().css({ top: e.pixel[1] + 20, left: e.pixel[0] + 20, transform: 'none' })
  } else {
    $('#heliupup').show().css({ top: 'auto', left: '50%', bottom: '0', transform: 'translate(-190px, 0px)' })
  }
}

export async function getqynumzong(mc, e, lei, type) {
  var item = {
    name: mc, nr1: 0 + '个', nr2: 0 + '个', nr3: 0 + '个', nr4: 0 + '个'
  }
  const { status, data } = await getNumByQySx({
    mc: mc, type: lei
  })
  if (status === 0 && data) {
    item.nr1 = data.total + '个'
    item.nr2 = data.gk + '个'
    if (data.gkDm == null) {
      data.gkDm = ''
    }
    if (data.gkDm != 0) {
      if (data.gkDm != '') {
        item.nr2 += '（' + data.gkDm + '）'
      }
    }
    item.nr3 = data.sk + '个'
    if (data.skDm == null) {
      data.skDm = ''
    }
    if (data.skDm != 0) {
      if (data.skDm != '') {
        item.nr3 += '（' + data.skDm + '）'
      }
    }
    item.nr4 = data.sjjk + '个'
    if (data.sjjkDm == null) {
      data.sjjkDm = ''
    }
    if (data.sjjkDm != 0) {
      if (data.sjjkDm != '') {
        item.nr4 += '（' + data.sjjkDm + '）'
      }
    }
    const mapHoverData = _setHoverData(type, item)
    const mapHoverBox = _setHoverContent(mapHoverData, 'xxs')
    $('#heliupup-content .mapHoverTitle').html(item.name)
    $('#heliupup-content .mapHoverContent').html(mapHoverBox)
    if (e) {
      $('#heliupup').show().css({ top: e.pixel[1] + 20, left: e.pixel[0] + 20, transform: 'none' })
    } else {
      $('#heliupup').show().css({ top: '50%', left: '50%', transform: 'translate(-190px, -200px)' })
    }
  } else {
    const mapHoverData = _setHoverData(type, item)
    const mapHoverBox = _setHoverContent(mapHoverData, 'xxs')
    $('#heliupup-content .mapHoverTitle').html(item.name)
    $('#heliupup-content .mapHoverContent').html(mapHoverBox)
    if (e) {
      $('#heliupup').show().css({ top: e.pixel[1] + 20, left: e.pixel[0] + 20, transform: 'none' })
    } else {
      $('#heliupup').show().css({ top: '50%', left: '50%', transform: 'translate(-190px, -200px)' })
    }
  }
}

/* zoom*/
function getLods() {
  var lods = [{
    level: 0, resolution: 0.04399456361617579
  }, {
    level: 1, resolution: 0.021997325490126382
  }, {
    level: 2, resolution: 0.010998662745063191
  }, {
    level: 3, resolution: 0.0054993313725315955
  }, {
    level: 4, resolution: 0.004283029810494504
  }, {
    level: 5, resolution: 0.0027496656862657978
  }, {
    level: 6, resolution: 0.0013748328431328989
  }, {
    level: 7, resolution: 6.874164215664494E-4
  }, {
    level: 8, resolution: 3.437082107832247E-4
  }, {
    level: 9, resolution: 1.7185410539161236E-4
  }, {
    level: 10, resolution: 8.592705269580618E-5
  }, {
    level: 11, resolution: 4.296352634790309E-5
  }, {
    level: 12, resolution: 2.1481763173951545E-5
  }, {
    level: 13, resolution: 1.0740881586975772E-5
  }]
  var resolutions = []
  var matrixIds = []
  for (var i = 0; i < lods.length; i++) {
    resolutions.push(lods[i].resolution)
    matrixIds.push(lods[i].level)
  }
  return [resolutions, matrixIds]
}

/**
 * 添加地图点位
 * @param {object} map 地图对象
 * @param {Array} data 点位数据
 * @param {String} type 点位类型 'AQI','WATER','POLLUTION'
 * @param {Boolean} isText 是否显示文字
 * @param {Boolean} isDing 是否定位
 */
export function addPoint(map, data, type, isText = false, isDing = false, centerPoint, sfqk) {
  // console.log('data', data)
  // console.log('type', type)
  if (data == undefined) {
    data = []
  }
  if (type == 'cqd' || type == 'jahy_ycwwhy') {
    isText = true
  }
  if (highlightLayer != null) {
    map.removeLayer(highlightLayer)
  }
  // 污染物点位显示隐藏
  if (eshuju != null) {
    if (eshuju.wryListOpt.includes(type)) {
      map.removeLayer(type)
    }
  }

  // qingkongtu(map)
  if (yintuceng != null) {
    map.removeLayer(yintuceng)
    // yintuceng.getSource().clear()
  }
  if (shituceng != null) {
    map.removeLayer(shituceng)
    // shituceng.getSource().clear()
  }
  if (sfqk && sfqk != undefined) {
  } else {
    if (pointtuceng != null) {
      map.removeLayer(pointtuceng)
      // pointtuceng.getSource().clear()
    }
    wrypointlisttuceng.forEach((v, i) => {
      map.removeLayer(v)
    })
  }
  if (type == 'mianlist') {
    if (haiyangtu3 != null) {
      map.removeLayer(haiyangtu3)
    }
  }
  if (type == 'rhdm') {
    if (eshuju.bdhdwlist.rhdm != null) {
      map.removeLayer(eshuju.bdhdwlist.rhdm)
    }
  }
  if (type == 'rhk') {
    if (eshuju.bdhdwlist.rhk != null) {
      map.removeLayer(eshuju.bdhdwlist.rhk)
    }
  }
  if (type == 'ycjcd') {
    if (eshuju.bdhdwlist.ycjcd != null) {
      map.removeLayer(eshuju.bdhdwlist.ycjcd)
    }
  }
  if (type == 'bzjcd') {
    if (eshuju.bdhdwlist.bzjcd != null) {
      map.removeLayer(eshuju.bdhdwlist.bzjcd)
    }
  }
  if (type == 'gcn') {
    if (eshuju.bdhdwlist.gcn != null) {
      map.removeLayer(eshuju.bdhdwlist.gcn)
    }
  }
  if (type == 'gcw') {
    if (eshuju.bdhdwlist.gcw != null) {
      map.removeLayer(eshuju.bdhdwlist.gcw)
    }
  }
  if (type == 'wsclc') {
    if (eshuju.bdhdwlist.wsclc != null) {
      map.removeLayer(eshuju.bdhdwlist.wsclc)
    }
  }
  if (type == 'yhpk') {
    if (eshuju.bdhdwlist.yhpk != null) {
      map.removeLayer(eshuju.bdhdwlist.yhpk)
    }
  }
  if (type == 'zs') {
    if (eshuju.bdhdwlist.zs != null) {
      map.removeLayer(eshuju.bdhdwlist.zs)
    }
  }
  if (type == 'dq') {
    if (eshuju.bdhdwlist.dq != null) {
      map.removeLayer(eshuju.bdhdwlist.dq)
    }
  }
  if (type == 'jahysjqx') {
    if (eshuju.bdhdwlist.jahysjqx != null) {
      map.removeLayer(eshuju.bdhdwlist.jahysjqx)
    }
  }
  if (type == 'yysyd') {
    if (eshuju.bdhdwlist.yysyd != null) {
      map.removeLayer(eshuju.bdhdwlist.yysyd)
    }
  }
  if (type == 'zph') {
    if (eshuju.bdhdwlist.zph != null) {
      map.removeLayer(eshuju.bdhdwlist.zph)
    }
  }
  //
  if (type == 'wsgw') {
    if (beng_tc != null) {
      map.removeLayer(beng_tc)
    }
  }
  if (type == 'gwxx') {
    if (ru_hai3 != null) {
      map.removeLayer(ru_hai3)
    }
  }
  if (type == 'smd') {
    if (ru_yus2 != null) {
      map.removeLayer(ru_yus2)
    }
  }
  if (type == 'cqd') {
    if (ru_yu5 != null) {
      map.removeLayer(ru_yu5)
    }
  }
  if (type == 'mdd') {
    if (ru_yu_6 != null) {
      map.removeLayer(ru_yu_6)
    }
  }
  if (type == 'yyd') {
    if (ru_yu4 != null) {
      map.removeLayer(ru_yu4)
    }
  }
  if (type == 'cqpk') {
    if (ru_hai4 != null) {
      map.removeLayer(ru_hai4)
    }
  }
  // -----------------------污染源-----------------
  if (type == '傍河村庄') {
    if (eshuju.wryAllList.bhcz != null) {
      map.removeLayer(eshuju.wryAllList.bhcz)
    }
  }
  if (type == '入河排污口') {
    if (eshuju.wryAllList.rhpwk != null) {
      map.removeLayer(eshuju.wryAllList.rhpwk)
    }
  }
  if (type == '规上畜禽养殖') {
    if (eshuju.wryAllList.gscqyz != null) {
      map.removeLayer(eshuju.wryAllList.gscqyz)
    }
  }
  if (type == '规下畜禽养殖') {
    if (eshuju.wryAllList.gxcqyz != null) {
      map.removeLayer(eshuju.wryAllList.gxcqyz)
    }
  }
  if (type == '水产养殖企业') {
    if (eshuju.wryAllList.scyzqy != null) {
      map.removeLayer(eshuju.wryAllList.scyzqy)
    }
  }
  if (type == '污水处理厂') {
    if (eshuju.wryAllList.wsclc != null) {
      map.removeLayer(eshuju.wryAllList.wsclc)
    }
  }
  if (type == '涉氮企业') {
    if (eshuju.wryAllList.sdqy != null) {
      map.removeLayer(eshuju.wryAllList.sdqy)
    }
  }
  if (type == '闸坝') {
    if (eshuju.wryAllList.zb != null) {
      map.removeLayer(eshuju.wryAllList.zb)
    }
  }
  if (type == '人工湿地') {
    if (eshuju.wryAllList.rgsd != null) {
      map.removeLayer(eshuju.wryAllList.rgsd)
    }
  }
  if (type == '河湖缓冲带') {
    if (eshuju.wryAllList.hhhcd != null) {
      map.removeLayer(eshuju.wryAllList.hhhcd)
    }
  }
  if (type == 'b_gy') {
    if (eshuju.bdhAllList.gyqy != null) {
      map.removeLayer(eshuju.bdhAllList.gyqy)
    }
  }
  if (type == 'dbshui') {
    if (eshuju.bdhAllList.dbshui != null) {
      map.removeLayer(eshuju.bdhAllList.dbshui)
    }
  }
  if (type == 'dbsszzdz') {
    if (eshuju.bdhAllList.dbsszzdz != null) {
      map.removeLayer(eshuju.bdhAllList.dbsszzdz)
    }
  }
  if (type == 'b_jz') {
    if (eshuju.bdhAllList.wsccc != null) {
      map.removeLayer(eshuju.bdhAllList.wsccc)
    }
  }
  if (type == 'b_1xq') {
    if (eshuju.bdhAllList.xq1yz != null) {
      map.removeLayer(eshuju.bdhAllList.xq1yz)
    }
  }
  if (type == 'b_2xq') {
    if (eshuju.bdhAllList.xq2yz != null) {
      map.removeLayer(eshuju.bdhAllList.xq2yz)
    }
  }
  if (type == 'b_sc') {
    if (eshuju.bdhAllList.scyz != null) {
      map.removeLayer(eshuju.bdhAllList.scyz)
    }
  }
  if (type == 'b_pk') {
    if (eshuju.bdhAllList.rhpwk != null) {
      map.removeLayer(eshuju.bdhAllList.rhpwk)
    }
  }
  if (type == 'b_cz') {
    if (eshuju.bdhAllList.pwcz != null) {
      map.removeLayer(eshuju.bdhAllList.pwcz)
    }
  }
  if (type == 'b_shfxy') {
    if (eshuju.bdhAllList.b_shfxy != null) {
      map.removeLayer(eshuju.bdhAllList.b_shfxy)
    }
  }
  if (type == 'b_wsbz') {
    if (eshuju.bdhAllList.b_wsbz != null) {
      map.removeLayer(eshuju.bdhAllList.b_wsbz)
    }
  }
  if (type == 'bdh_rhpwk') {
    if (eshuju.bdhAllList.bdh_rhpwk != null) {
      map.removeLayer(eshuju.bdhAllList.bdh_rhpwk)
    }
  }
  if (type == 'bdh_shfxy') {
    if (eshuju.bdhAllList.bdh_shfxy != null) {
      map.removeLayer(eshuju.bdhAllList.bdh_shfxy)
    }
  }
  if (type == 'jahy_jahy') {
    if (eshuju.bdhJahyAllList.jahy != null) {
      map.removeLayer(eshuju.bdhJahyAllList.jahy)
    }
  }
  if (type == 'jahy_hsyc') {
    if (eshuju.bdhJahyAllList.hsyc != null) {
      map.removeLayer(eshuju.bdhJahyAllList.hsyc)
    }
  }
  if (type == 'jahy_ycwwhy') {
    if (eshuju.bdhJahyAllList.ycwwhy != null) {
      if (eshuju.bdhJahyAllList.ycwwhy.length != 0) {
        for (var i = 0; i < eshuju.bdhJahyAllList.ycwwhy.length; i++) {
          map.removeLayer(eshuju.bdhJahyAllList.ycwwhy[i])
        }
      }
    }
  }
  if (type == 'jahy_qhdghy') {
    if (eshuju.bdhJahyAllList.qhdghy != null) {
      map.removeLayer(eshuju.bdhJahyAllList.qhdghy)
    }
  }
  if (type == 'jahy_zdhkhy') {
    if (eshuju.bdhJahyAllList.zdhkhy != null) {
      map.removeLayer(eshuju.bdhJahyAllList.zdhkhy)
    }
  }
  if (type == 'jahy_ychzbhxqxjc') {
    if (eshuju.bdhJahyAllList.ychzbhxqxjc != null) {
      map.removeLayer(eshuju.bdhJahyAllList.ychzbhxqxjc)
    }
  }
  const features = []
  data.forEach((v, i) => {
    // 如果经度是NaN则不在渲染点位
    if (isNaN(Number(v.jd) || Number(v.longitude) || Number(v.qsdjd) || Number(v.lon) || Number(v.lng))) {
      return
    }
    if (v.lon == '' && v.lat == '') {
      return
    }
    // 设置图片位置
    var iconFeature = new ol.Feature({
      geometry: new ol.geom.Point([Number(v.jd) || Number(v.longitude) || Number(v.qsdjd) || Number(v.lon) || Number(v.lng), Number(v.wd) || Number(v.latitude) || Number(v.qsdwd) || Number(v.lat)])
    })
    if (type == 'zd') {
      // 设置样式，这里使用图片
      var tkuan = 3
      var tgao = parseFloat(v.nd) / parseFloat(v.wd)
      // tgao=2
      iconFeature.setStyle(new ol.style.Style({
        text: new ol.style.Text({
          font: '0px sans-serif', text: ' ', // v.dmmc,
          padding: [tgao, tkuan, 0, 0], backgroundStroke: new ol.style.Stroke({
            color: 'red', width: 1
          }), backgroundFill: new ol.style.Fill({
            color: 'rgba(255, 0, 0, 0.6)' // 设置背景填充色为红色半透明
          })
        })
      }))
    } else {
      if (isText) {
        // 设置样式，这里使用文字+图片
        if (type == 'cqd') {
          iconFeature.setStyle(new ol.style.Style({
            image: new ol.style.Icon({
              src: getIconByData(v, type).img, anchor: [0.5, 0.5], scale: getIconByData(v, type).scale // 设置图标的缩放比例
            }), text: new ol.style.Text({
              font: '12px', text: _getText(v, type), fill: new ol.style.Fill({
                color: [0, 0, 0]
              })
            })
          }))
        } else if (type == 'jahy_ycwwhy') {
          if (v.dwmc == '2.5-6') {
            iconFeature.setStyle(new ol.style.Style({
              image: new ol.style.Icon({
                src: getIconByData(v, type).img, anchor: [0.5, 0.5], scale: getIconByData(v, type).scale // 设置图标的缩放比例
              }), text: new ol.style.Text({
                textAlign: 'left', // 位置
                // offsetX: '38', // 水平方向偏移量
                // offsetY: '-8', // 垂直方向偏移量
                padding: [5, 5, 5, 20], font: '12px', text: '     2.5海里', fill: new ol.style.Fill({
                  color: [0, 0, 0]
                })
              })
            }))
          } else if (v.dwmc == '5-6') {
            iconFeature.setStyle(new ol.style.Style({
              image: new ol.style.Icon({
                src: getIconByData(v, type).img, anchor: [0.5, 0.5], scale: getIconByData(v, type).scale // 设置图标的缩放比例
              }), text: new ol.style.Text({
                textAlign: 'left', // 位置
                // offsetX: '38', // 水平方向偏移量
                // offsetY: '-8', // 垂直方向偏移量
                padding: [5, 5, 5, 20], font: '12px', text: '     5海里', fill: new ol.style.Fill({
                  color: [0, 0, 0]
                })
              })
            }))
          } else if (v.dwmc == '12-6') {
            iconFeature.setStyle(new ol.style.Style({
              image: new ol.style.Icon({
                src: getIconByData(v, type).img, anchor: [0.5, 0.5], scale: getIconByData(v, type).scale // 设置图标的缩放比例
              }), text: new ol.style.Text({
                textAlign: 'left', // 位置
                // offsetX: '38', // 水平方向偏移量
                // offsetY: '-8', // 垂直方向偏移量
                padding: [5, 5, 5, 20], font: '12px', text: '     12海里', fill: new ol.style.Fill({
                  color: [0, 0, 0]
                })
              })
            }))
          } else {
            iconFeature.setStyle(new ol.style.Style({
              image: new ol.style.Icon({
                src: getIconByData(v, type).img, anchor: [0.5, 0.5], scale: getIconByData(v, type).scale // 设置图标的缩放比例
              }), text: new ol.style.Text({
                font: '12px', text: _getText(v, type), fill: new ol.style.Fill({
                  color: [255, 255, 255]
                })
              })
            }))
          }
        } else {
          iconFeature.setStyle(new ol.style.Style({
            image: new ol.style.Icon({
              src: getIconByData(v, type).img, anchor: [0.5, 0.5], scale: getIconByData(v, type).scale // 设置图标的缩放比例
            }), text: new ol.style.Text({
              font: '12px', text: _getText(v, type), fill: new ol.style.Fill({
                color: [255, 255, 255]
              })
            })
          }))
        }
      } else {
        // 设置样式，这里使用图片
        let targetSrc
        if (type === 'dbsszzdz') {
          v.ccljjz == '1' ? targetSrc = require('../../assets/images/dbsIcons/qtcz6.png') : targetSrc = require('../../assets/images/dbsIcons/qtcz7.png')
        }
        // 设置样式，这里使用图片
        iconFeature.setStyle(new ol.style.Style({
          image: new ol.style.Icon({
            src: type === 'dbsszzdz' ? targetSrc : getIconByData(v, type).img, // size: [getIconByData(v, type).imgW,getIconByData(v, type).imgH],
            anchor: [0.5, 0.5], scale: type === 'dbsszzdz' ? 15 / 22 : getIconByData(v, type).scale // 设置图标的缩放比例
          })
        }))
      }
    }
    iconFeature.setId('points_' + i)
    if (type == 'mianlist') {
      iconFeature.setProperties({
        type: 'mianlist', item: v, leixing: '石油勘探开发设施'
      })
    } else if (type == 'wsgw') {
      iconFeature.setProperties({
        type: 'wsgw', item: v, leixing: '污水流向'
      })
    } else if (type == 'gwxx') {
      iconFeature.setProperties({
        type: 'gwxx', item: v, leixing: '管网问题'
      })
    } else if (type == 'smd') {
      iconFeature.setProperties({
        type: 'smd', item: v, leixing: '水母点'
      })
    } else if (type == 'cqd') {
      iconFeature.setProperties({
        type: 'cqd', item: v, leixing: '沉潜点'
      })
    } else if (type == 'mdd') {
      iconFeature.setProperties({
        type: 'mdd', item: v, leixing: '锚地点'
      })
    } else if (type == 'yyd') {
      iconFeature.setProperties({
        type: 'yyd', item: v, leixing: '溢油点'
      })
    } else if (type == 'cqpk') {
      iconFeature.setProperties({
        type: 'cqpk', item: v, leixing: '涉海风险源厂区排口'
      })
    } else {
      iconFeature.setProperties({
        type: 'pointlist', item: v
      })
    }
    features.push(iconFeature)
  })
  const iconLayer = new ol.layer.Vector({
    zIndex: 999, className: 'ol_point', properties: 'pointlist', source: new ol.source.Vector({ features })
  })
  // 添加图层
  map.addLayer(iconLayer)

  if (type == 'mianlist') {
    haiyangtu3 = iconLayer
  } else if (type == 'rhdm') {
    eshuju.bdhdwlist.rhdm = iconLayer
    if (eshuju.stationActive == 3 && eshuju.BDxuans == 0) {
      eshuju.bdhdwlist.rhdm.setVisible(false)
    }
  } else if (type == 'rhk') {
    eshuju.bdhdwlist.rhk = iconLayer
    if (eshuju.stationActive == 3 && eshuju.BDxuans == 0) {
      eshuju.bdhdwlist.rhk.setVisible(false)
    }
  } else if (type == 'ycjcd') {
    eshuju.bdhdwlist.ycjcd = iconLayer
    if (eshuju.stationActive == 3 && eshuju.BDxuans == 0) {
      eshuju.bdhdwlist.ycjcd.setVisible(false)
    }
  } else if (type == 'bzjcd') {
    eshuju.bdhdwlist.bzjcd = iconLayer
    if (eshuju.stationActive == 3 && eshuju.BDxuans == 0) {
      eshuju.bdhdwlist.bzjcd.setVisible(false)
    }
  } else if (type == 'gcn') {
    eshuju.bdhdwlist.gcn = iconLayer
    if (eshuju.stationActive == 3 && eshuju.BDxuans == 0) {
      eshuju.bdhdwlist.gcn.setVisible(false)
    }
  } else if (type == 'gcw') {
    eshuju.bdhdwlist.gcw = iconLayer
    if (eshuju.stationActive == 3 && eshuju.BDxuans == 0) {
      eshuju.bdhdwlist.gcw.setVisible(false)
    }
  } else if (type == 'wsclc') {
    eshuju.bdhdwlist.wsclc = iconLayer
    if (eshuju.stationActive == 3 && eshuju.BDxuans == 0) {
      eshuju.bdhdwlist.wsclc.setVisible(false)
    }
  } else if (type == 'yhpk') {
    eshuju.bdhdwlist.yhpk = iconLayer
    if (eshuju.stationActive == 3 && eshuju.BDxuans == 0) {
      eshuju.bdhdwlist.yhpk.setVisible(false)
    }
  } else if (type == 'zs') {
    eshuju.bdhdwlist.zs = iconLayer
    if (eshuju.stationActive == 3 && eshuju.BDxuans == 0) {
      eshuju.bdhdwlist.zs.setVisible(false)
    }
  } else if (type == 'dq') {
    eshuju.bdhdwlist.dq = iconLayer
    if (eshuju.stationActive == 3 && eshuju.BDxuans == 0) {
      eshuju.bdhdwlist.dq.setVisible(false)
    }
  } else if (type == 'jahysjqx') {
    eshuju.bdhdwlist.jahysjqx = iconLayer
    if (eshuju.stationActive == 3 && eshuju.BDxuans == 0) {
      eshuju.bdhdwlist.jahysjqx.setVisible(false)
    }
  } else if (type == 'yysyd') {
    eshuju.bdhdwlist.yysyd = iconLayer
    if (eshuju.stationActive == 3 && eshuju.BDxuans == 0) {
      eshuju.bdhdwlist.yysyd.setVisible(false)
    }
  } else if (type == 'zph') {
    eshuju.bdhdwlist.zph = iconLayer
    if (eshuju.stationActive == 3 && eshuju.BDxuans == 0) {
      eshuju.bdhdwlist.zph.setVisible(false)
    }
  }
  //
  else if (type == 'wsgw') {
    beng_tc = iconLayer
    if (eshuju.stationActive == 3 && eshuju.BDxuans == 0) {
      beng_tc.setVisible(false)
    }
  } else if (type == 'gwxx') {
    ru_hai3 = iconLayer
    if (eshuju.stationActive == 3 && eshuju.BDxuans == 0) {
      ru_hai3.setVisible(false)
    }
  } else if (type == 'smd') {
    ru_yus2 = iconLayer
    if (eshuju.stationActive == 4 && eshuju.BDxuans == 0) {
      ru_yus2.setVisible(false)
    }
  } else if (type == 'cqd') {
    ru_yu5 = iconLayer
    if (eshuju.stationActive == 4 && eshuju.BDxuans == 0) {
      ru_yu5.setVisible(false)
    }
  } else if (type == 'mdd') {
    ru_yu_6 = iconLayer
    if (eshuju.stationActive == 4 && eshuju.BDxuans == 0) {
      ru_yu_6.setVisible(false)
    }
  } else if (type == 'yyd') {
    ru_yu4 = iconLayer
    if (eshuju.stationActive == 4 && eshuju.BDxuans == 0) {
      ru_yu4.setVisible(false)
    }
  } else if (type == 'cqpk') {
    ru_hai4 = iconLayer
    if (eshuju.stationActive == 3 && eshuju.BDxuans == 0) {
      ru_hai4.setVisible(false)
    }
  }
  // -----------------------污染物图层------------------------
  else if (type == '傍河村庄') {
    eshuju.wryAllList.bhcz = iconLayer
  } else if (type == '入河排污口') {
    eshuju.wryAllList.rhpwk = iconLayer
  } else if (type == '规上畜禽养殖') {
    eshuju.wryAllList.gscqyz = iconLayer
  } else if (type == '规下畜禽养殖') {
    eshuju.wryAllList.gxcqyz = iconLayer
  } else if (type == '水产养殖企业') {
    eshuju.wryAllList.scyzqy = iconLayer
  } else if (type == '污水处理厂') {
    eshuju.wryAllList.wsclc = iconLayer
  } else if (type == '涉氮企业') {
    eshuju.wryAllList.sdqy = iconLayer
  } else if (type == '闸坝') {
    eshuju.wryAllList.zb = iconLayer
  } else if (type == '人工湿地') {
    eshuju.wryAllList.rgsd = iconLayer
  } else if (type == '河湖缓冲带') {
    eshuju.wryAllList.hhhcd = iconLayer
  } else if (type == 'b_gy') {
    eshuju.bdhAllList.gyqy = iconLayer
  } else if (type == 'dbsszzdz') {
    eshuju.bdhAllList.dbsszzdz = iconLayer
  } else if (type == 'dbshui') {
    eshuju.bdhAllList.dbshui = iconLayer
  } else if (type == 'b_jz') {
    eshuju.bdhAllList.wsccc = iconLayer
  } else if (type == 'b_1xq') {
    eshuju.bdhAllList.xq1yz = iconLayer
  } else if (type == 'b_2xq') {
    eshuju.bdhAllList.xq2yz = iconLayer
  } else if (type == 'b_sc') {
    eshuju.bdhAllList.scyz = iconLayer
  } else if (type == 'b_pk') {
    eshuju.bdhAllList.rhpwk = iconLayer
  } else if (type == 'b_cz') {
    eshuju.bdhAllList.pwcz = iconLayer
  } else if (type == 'b_shfxy') {
    eshuju.bdhAllList.b_shfxy = iconLayer
  } else if (type == 'b_wsbz') {
    eshuju.bdhAllList.b_wsbz = iconLayer
  } else if (type == 'bdh_rhpwk') {
    eshuju.bdhAllList.bdh_rhpwk = iconLayer
  } else if (type == 'bdh_shfxy') {
    eshuju.bdhAllList.bdh_shfxy = iconLayer
  } else if (type == 'jahy_jahy') {
    eshuju.bdhJahyAllList.jahy = iconLayer
  } else if (type == 'jahy_hsyc') {
    eshuju.bdhJahyAllList.hsyc = iconLayer
  } else if (type == 'jahy_ycwwhy') {
    eshuju.bdhJahyAllList.ycwwhy = []
    eshuju.bdhJahyAllList.ycwwhy.push(iconLayer)
    lianxianxx(map, data)
  } else if (type == 'jahy_qhdghy') {
    eshuju.bdhJahyAllList.qhdghy = iconLayer
  } else if (type == 'jahy_zdhkhy') {
    eshuju.bdhJahyAllList.zdhkhy = iconLayer
  } else if (type == 'jahy_ychzbhxqxjc') {
    eshuju.bdhJahyAllList.ychzbhxqxjc = iconLayer
  } else {
    pointtuceng = iconLayer
  }
  if (sfqk && sfqk != undefined) {
    wrypointlisttuceng.push(pointtuceng)
  }
  if (isDing) {
    if (data.length === 1) {
      heightAndCenter(Number(data[0].jd) || Number(data[0].longitude) || Number(data[0].qsdjd) || Number(data[0].lon) || Number(data[0].lng), Number(data[0].wd) || Number(data[0].latitude) || Number(data[0].qsdwd) || Number(data[0].lat), map)
    } else if (centerPoint) {
      mapAndCenter(centerPoint.lon, centerPoint.lat, map, centerPoint.zoom)
    } else {
      if (stationActive == 5) {
        mapAndCenter(116.283976, 39.556141, map, 8)
      } else {
        mapAndCenter(119.41010268430291, 39.74080657918234, map, 5)
      }
    }
  }
  pointerHover(map, type)
}

function getGreatCircleDistance(lat1, lng1, lat2, lng2) {
  var EARTH_RADIUS = 6378137.0 // 单位M
  var radLat1 = getRad(lat1)
  var radLat2 = getRad(lat2)

  var a = radLat1 - radLat2
  var b = getRad(lng1) - getRad(lng2)

  var s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) + Math.cos(radLat1) * Math.cos(radLat2) * Math.pow(Math.sin(b / 2), 2)))
  s = s * EARTH_RADIUS
  s = Math.round(s * 10000) / 10000.0

  return s
}

function getRad(d) {
  var PI = Math.PI
  return d * PI / 180.0
}

export function qieshujuxx(map, val) {
  // 1. 首先把所有图层状态关闭
  eshuju.jcdvalue400 = false
  eshuju.jcdvalue40 = false
  eshuju.jcdvalue41 = false
  eshuju.jcdvalue42 = false
  eshuju.jcdvalue43 = false
  eshuju.jcdvalue44 = false
  eshuju.jcdvalue45 = false
  eshuju.jcdvalue46 = false
  eshuju.jcdvalue47 = false

  // 2. 总状态 - 渲染多图层方法 - xyduotc('bdh_jahy_jctl')
  eshuju.changeywtc(400)

  eshuju.clearmrparame('bdh')
  eshuju.clearWry()
  useClearMap('cz', map)
  if (val == 2) {
    eshuju.jcdvalue40 = true
    eshuju.jcdvalue47 = true
    xyduotc('tl_qie1')
  } else if (val == 3) {
    // 打开 - 水母打捞作业区、拦截导流网 图层
    eshuju.jcdvalue41 = true
    // 打开开关之后 - 进行渲染 水母打捞作业区 图层
    xyduotc('tl_qie2')
  } else if (val == 4) {
    eshuju.jcdvalue42 = true
    xyduotc('tl_qie3')
  } else if (val == 5) {
    eshuju.jcdvalue43 = true
    eshuju.jcdvalue44 = true
    eshuju.jcdvalue45 = true
    xyduotc('tl_qie4')
  }
}

export function lianxianxx(map, data) {
  // console.log(1111111)//dwmc
  if (data.length == 0) {
    return
  }
  var data1 = [[119.7946, 39.8996], [119.7873, 39.825], [119.7735, 39.7435], [119.6994, 39.6574], [119.5847, 39.6126], [119.4474, 39.6191], [119.3519, 39.6629]]
  var data2 = [[119.596, 39.8745], [119.6271, 39.8438], [119.6315, 39.7835], [119.6008, 39.7452], [119.5349, 39.726], [119.4716, 39.7385], [119.4317, 39.7727]]
  var data3 = [[119.5472, 39.8393], [119.5733, 39.8328], [119.5816, 39.8004], [119.5649, 39.7772], [119.5268, 39.7676], [119.4885, 39.7815], [119.4728, 39.793]]
  var count = 3
  for (var m = 0; m < count; m++) {
    const features = []
    if (m == 0) {
      var datas = data1
    } else if (m == 1) {
      var datas = data2
    } else if (m == 2) {
      var datas = data3
    }
    var feature = new ol.Feature({
      type: 'Polygon', geometry: new ol.geom.LineString(datas)
    })
    features.push(feature)
    var xxinz = new ol.layer.Vector({
      zIndex: 5, source: new ol.source.Vector({ features }), style: function(feature) {
        return new ol.style.Style({
          stroke: new ol.style.Stroke({
            color: '#484646', width: 1, lineDash: [20, 10, 20, 10]
          })
        })
      }
    })
    map.addLayer(xxinz)
    xxinz.setVisible(true)
    if (eshuju.bdhJahyAllList.ycwwhy != null) {
      if (eshuju.bdhJahyAllList.ycwwhy.length != 0) {
        eshuju.bdhJahyAllList.ycwwhy.push(xxinz)
      }
    }
  }
}

/* 添加市级点位*/
export function addshiji(map, data, type, sfxian) {
  // qingkongtu(map)
  if (highlightLayer != null) {
    map.removeLayer(highlightLayer)
  }
  if (shituceng != null) {
    map.removeLayer(shituceng)
  }
  if (pointtuceng != null) {
    map.removeLayer(pointtuceng)
  }
  const features = []
  var imgs = require('../../assets/images/mapIcons/shi_bg_small.png')
  if (type == 'WRYztqk' || type == 'WRY') {
    imgs = require('../../assets/images/mapIcons/shi_bg_small_bold.png')
  }
  data.forEach((v, i) => {
    // 设置图片位置
    const iconFeature = new ol.Feature({
      geometry: new ol.geom.Point([fanhuijwd(v.xzqh)[0], fanhuijwd(v.xzqh)[1]])
    })
    // 设置样式，这里使用文字+图片
    iconFeature.setStyle(new ol.style.Style({
      image: new ol.style.Icon({
        width: 100, src: imgs
      }), text: new ol.style.Text({
        font: '12px sans-serif',
        text: v.cityName + '\n' + v.num + (v.numUnit ? v.numUnit : '家'),
        padding: [0, 10, 0, 10],
        fill: new ol.style.Fill({
          color: [255, 255, 255]
        })
      })
    }))
    iconFeature.setId('shid_' + i)
    iconFeature.setProperties({
      type: 'shilist', item: v
    })
    features.push(iconFeature)
  })
  const visible = map.getView().getZoom() < showPointZoom
  const iconLayer = new ol.layer.Vector({
    zIndex: 999,
    visible: visible,
    className: 'ol_shi',
    properties: 'shilist',
    source: new ol.source.Vector({ features })
  })
  // 清除监听
  if (shitucengListener) {
    ol.Observable.unByKey(shitucengListener)
  }
  // 添加监听
  shitucengListener = map.on('click', function(evt) {
    // 处理点击事件
    var feature = map.forEachFeatureAtPixel(evt.pixel, function(feature) {
      return feature
    }, { hitTolerance: 10 })
    closeInfoWin()
    if (feature) {
      const res = feature.getProperties()
      if (res.type == 'shilist') {
        const item = res.item
        const { lon, lat, zoom } = fanhuiMapCenter(item.xzqh)
        mapAndCenter(lon, lat, map, Number(zoom))
      }
    }
  })
  // 添加图层
  map.addLayer(iconLayer)
  shituceng = iconLayer
  if (sfxian && sfxian != '') {
    shituceng.setVisible(true)
  }
}

/* 添加聚合点位*/
export function addydian(map, data, type, isText = false, isDing = false, centerPoint) {
  // qingkongtu(map)
  if (highlightLayer != null) {
    map.removeLayer(highlightLayer)
  }
  if (yintuceng != null) {
    map.removeLayer(yintuceng)
    // yintuceng.getSource().clear()
  }
  if (pointtuceng != null) {
    map.removeLayer(pointtuceng)
    // pointtuceng.getSource().clear()
  }
  const features = []
  data.forEach((v, i) => {
    // 如果经度是NaN则不在渲染点位
    if (isNaN(Number(v.jd) || Number(v.longitude) || Number(v.qsdjd) || Number(v.lon) || Number(v.lng))) {
      return
    }
    // 设置图片位置
    const iconFeature = new ol.Feature({
      geometry: new ol.geom.Point([Number(v.jd) || Number(v.longitude) || Number(v.qsdjd) || Number(v.lon) || Number(v.lng), Number(v.wd) || Number(v.latitude) || Number(v.qsdwd) || Number(v.lat)])
    })
    if (isText) {
      // 设置样式，这里使用文字+图片
      iconFeature.setStyle(new ol.style.Style({
        image: new ol.style.Icon({
          src: getIconByData(v, type).img, scale: getIconByData(v, type).scale // 设置图标的缩放比例
        }), text: new ol.style.Text({
          font: '12px', text: _getText(v, type), fill: new ol.style.Fill({
            color: [255, 255, 255]
          })
        })
      }))
    } else {
      // 设置样式，这里使用图片
      iconFeature.setStyle(new ol.style.Style({
        image: new ol.style.Icon({
          src: getIconByData(v, type).img, scale: getIconByData(v, type).scale // 设置图标的缩放比例
          // size: [getIconByData(v, type).imgW,getIconByData(v, type).imgH]
        })
      }))
    }
    iconFeature.setId('ypoints_' + i)
    iconFeature.setProperties({
      type: 'yinlist', item: v
    })
    features.push(iconFeature)
  })
  const visible = map.getView().getZoom() >= showPointZoom
  if (type == 'WRYztqk' || type == 'WRY') {
    var iconLayer = new ol.layer.Vector({
      zIndex: 999, visible: visible, className: 'ol_ypoint', properties: 'yinlist', source: new ol.source.Cluster({
        distance: 50, source: new ol.source.Vector({ features })
      }), style: clusterStyle
    })
  } else {
    var iconLayer = new ol.layer.Vector({
      zIndex: 999,
      visible: visible,
      className: 'ol_ypoint',
      properties: 'yinlist',
      source: new ol.source.Vector({ features })
    })
  }
  // 添加图层
  map.addLayer(iconLayer)
  yintuceng = iconLayer
  pointerHover(map, type)

  function clusterStyle(feature) {
    // console.log(feature)
    if (feature) {
      const size = feature.get('features').length
      if (size > 1) {
        return [new ol.style.Style({
          image: new ol.style.Circle({
            radius: 14, stroke: new ol.style.Stroke({
              color: '#0F96EA', width: 1
            }), fill: new ol.style.Fill({
              color: '#193357'
            })
          }), text: new ol.style.Text({
            textAlign: 'center',
            textBaseline: 'middle',
            offsetY: 1,
            font: '12px',
            text: size.toString(),
            fill: new ol.style.Fill({
              color: '#fff'
            })
          })
        })]
      }
      const originalFeature = feature.get('features')[0]
      var datas = originalFeature.get('item')
      return new ol.style.Style({
        geometry: originalFeature.getGeometry(), image: new ol.style.Icon({
          src: getIconByData(datas, type).img, scale: getIconByData(datas, type).scale
        })
      })
    }
  }
}

/* 添加聚合点位*/
export function addxdian(map, data, type, isText = false, isDing = false, centerPoint) {
  // qingkongtu(map)
  if (highlightLayer != null) {
    map.removeLayer(highlightLayer)
  }
  if (shituceng != null) {
    map.removeLayer(shituceng)
    // shituceng.getSource().clear()
  }
  if (yintuceng != null) {
    map.removeLayer(yintuceng)
    // yintuceng.getSource().clear()
  }
  if (pointtuceng != null) {
    map.removeLayer(pointtuceng)
    // pointtuceng.getSource().clear()
  }
  const features = []
  data.forEach((v, i) => {
    // 如果经度是NaN则不在渲染点位
    if (isNaN(Number(v.jd) || Number(v.longitude) || Number(v.qsdjd) || Number(v.lon) || Number(v.lng))) {
      return
    }
    // 设置图片位置
    const iconFeature = new ol.Feature({
      geometry: new ol.geom.Point([Number(v.jd) || Number(v.longitude) || Number(v.qsdjd) || Number(v.lon) || Number(v.lng), Number(v.wd) || Number(v.latitude) || Number(v.qsdwd) || Number(v.lat)])
    })
    if (isText) {
      // 设置样式，这里使用文字+图片
      iconFeature.setStyle(new ol.style.Style({
        image: new ol.style.Icon({
          src: getIconByData(v, type).img, scale: getIconByData(v, type).scale // 设置图标的缩放比例
          // size: [getIconByData(v, type).imgW,getIconByData(v, type).imgH]
        }), text: new ol.style.Text({
          font: '12px', text: _getText(v, type), fill: new ol.style.Fill({
            color: [255, 255, 255]
          })
        })
      }))
    } else {
      // 设置样式，这里使用图片
      iconFeature.setStyle(new ol.style.Style({
        image: new ol.style.Icon({
          src: getIconByData(v, type).img, scale: getIconByData(v, type).scale // 设置图标的缩放比例
          // size: [getIconByData(v, type).imgW,getIconByData(v, type).imgH]
        })
      }))
    }
    iconFeature.setId('ypoints_' + i)
    iconFeature.setProperties({
      type: 'yinlist', item: v
    })
    features.push(iconFeature)
  })
  const visible = map.getView().getZoom() >= showPointZoom
  if (type == 'WRYztqk' || type == 'WRY') {
    var iconLayer = new ol.layer.Vector({
      zIndex: 999, visible: visible, className: 'ol_ypoint', properties: 'yinlist', source: new ol.source.Cluster({
        distance: 50, source: new ol.source.Vector({ features })
      }), style: clusterStyle
    })
  } else {
    var iconLayer = new ol.layer.Vector({
      zIndex: 999,
      visible: visible,
      className: 'ol_ypoint',
      properties: 'yinlist',
      source: new ol.source.Vector({ features })
    })
  }
  // 添加图层
  map.addLayer(iconLayer)
  shituceng = iconLayer
  shituceng.setVisible(true)
  pointerHover(map, type)

  function clusterStyle(feature) {
    // console.log(feature)
    if (feature) {
      const size = feature.get('features').length
      if (size > 1) {
        return [new ol.style.Style({
          image: new ol.style.Circle({
            radius: 14, stroke: new ol.style.Stroke({
              color: '#0F96EA', width: 1
            }), fill: new ol.style.Fill({
              color: '#193357'
            })
          }), text: new ol.style.Text({
            textAlign: 'center',
            textBaseline: 'middle',
            offsetY: 1,
            font: '12px',
            text: size.toString(),
            fill: new ol.style.Fill({
              color: '#fff'
            })
          })
        })]
      }
      const originalFeature = feature.get('features')[0]
      var datas = originalFeature.get('item')
      return new ol.style.Style({
        geometry: originalFeature.getGeometry(), image: new ol.style.Icon({
          src: getIconByData(datas, type).img, scale: getIconByData(datas, type).scale
        })
      })
    }
  }
}

/* 悬浮框*/
export function pointerHover(map, type) {
  if (xuanfuListener) {
    ol.Observable.unByKey(xuanfuListener)
  }
  xuanfuListener = map.on('pointermove', async function(evt) {
    var feature = map.forEachFeatureAtPixel(evt.pixel, function(feature) {
      return feature
    }, { hitTolerance: 10 })
    closeInfoWin()
    if (feature) {
      if (type == 'WRYztqk' || type == 'WRY') {
        if (feature.get('features')) {
          feature = feature.get('features')[0]
        }
      }
      const res = feature.getProperties()
      if (res.type == 'pointlist' || res.type == 'yinlist' || res.type == 'wsgw' || res.type == 'gwxx' || res.type == 'cqpk' || res.type == 'smd' || res.type == 'cqd' || res.type == 'mdd' || res.type == 'yyd') {
        const item = res.item
        let mapHoverData = _setHoverData(type, item)
        if (stationActive == 2) {
          // 污染源数据
          if (type == 'ly') {
            // 请求点位接口
            const { data, status } = await getDwInfo({
              dataType: item.name, id: item.id, mc: item.mc
            })
            if (status == 0) {
              mapHoverData = _setHoverData(item.name, data[0])
              console.log('污染源数据', data)
            }
          }
        }
        if (stationActive == 3) {
          if (item.lx == '河流') {

          } else {
            mapHoverData = _setHoverData(item.lx, item)
          }
        }
        if (stationActive == 4) {
          if (item.lx == '水母点' || item.lx == '沉潜点' || item.lx == '污水流向' || item.lx == '污水管道' || item.lx == '涉海风险源厂区排口' || item.lx == '锚地点' || item.lx == '溢油点') {
            mapHoverData = _setHoverData(item.lx, item)
          }
        }
        if (mapHoverData == undefined) {
          return
        }
        const mapHoverBox = _setHoverContent(mapHoverData)
        popupContent.innerHTML = mapHoverBox
        popups.setPosition(map.getCoordinateFromPixel([evt.pixel[0], evt.pixel[1]]))
        popups.setOffset([0, 40])
      }
      if (res.type == 'mianlist' || res.type == 'mianslist') {
        const leixing = res.leixing
        const mapHoverData = _setHoverData(leixing, res)
        const mapHoverBox = _setHoverContent(mapHoverData)
        popupContent.innerHTML = mapHoverBox
        popups.setPosition(map.getCoordinateFromPixel([evt.pixel[0], evt.pixel[1]]))
        popups.setOffset([0, 40])
      }
    }
  })
}

/* 关闭点位悬浮框*/
export function closeInfoWin(e) {
  if (popups) {
    popups.setPosition(undefined)
  }
}

/* 关闭河流悬浮框*/
export function closesInfoWin(e) {
  $('#heliupup').hide()
}

export function hl_xiazai() {
  // console.log('下载')  '/hl.pdf'
  axios(MapConfig.ylfujian, { // pdf的位置
    responseType: 'blob' // 重要代码
  }).then(res => {
    const url = window.URL.createObjectURL(new Blob([res.data]))
    const link = document.createElement('a')
    link.href = url
    const fileName = '秦皇岛市新开河流域“一河一策一图+”环境应急响应方案.pdf' // 保存到本地的文件名称
    link.setAttribute('download', fileName)
    document.body.appendChild(link)
    link.click()
    console.log(link)
    link.remove()
  })
}

export function hl_yulan() {
  // console.log('预览')
  eshuju.hls_yulan()
}

export function addhighlightLayer(map, data) {
  // 设置图层
  if (highlightLayer != null) {
    map.removeLayer(highlightLayer)
  }
  const pointLayer = new ol.layer.Vector({ source: new ol.source.Vector() })
  highlightLayer = pointLayer
  // 添加图层
  map.addLayer(pointLayer)
  // 循环添加feature
  const pointFeature = []
  for (let i = 0; i < data.length; i++) {
    // 创建feature，一个feature就是一个点坐标信息
    const feature = new ol.Feature({
      geometry: new ol.geom.Point([data[i].longitude || data[i].jd, data[i].latitude || data[i].wd])
    })
    feature.setProperties({
      type: 'sslist', item: data[i]
    })
    pointFeature.push(feature)
  }
  // 把要素集合添加到图层
  pointLayer.getSource().addFeatures(pointFeature)
  // console.log('pointLayer', pointLayer);
  // 关键的地方在此：监听postrender事件，在里面重新设置circle的样式
  let radius = 0
  pointLayer.on('postrender', (e) => {
    if (radius >= 20) radius = 0
    const opacity = (20 - radius) * (1 / 20) // 不透明度
    // console.log(opacity)
    // 黄色
    const pointStyle1 = new ol.style.Style({
      image: new ol.style.Circle({
        radius: radius, stroke: new ol.style.Stroke({
          color: 'rgba(255,255,0' + opacity + ')', width: 3 - radius / 10 // 设置宽度
        })
      })
    })
    // 红色
    const pointStyle2 = new ol.style.Style({
      image: new ol.style.Circle({
        radius: radius, stroke: new ol.style.Stroke({
          color: 'rgba(255,0,0' + opacity + ')', width: 3 - radius / 10 // 设置宽度
        })
      })
    })
    // 获取矢量要素上下文
    const vectorContext1 = ol.render.getVectorContext(e)
    vectorContext1.setStyle(pointStyle1)
    const vectorContext2 = ol.render.getVectorContext(e)
    vectorContext2.setStyle(pointStyle2)
    pointFeature.forEach((feature) => {
      const res = feature.getProperties()
      if (res.item.dmmc == '洋洋花卉桥') {
        vectorContext2.drawGeometry(feature.getGeometry())
      } else {
        vectorContext1.drawGeometry(feature.getGeometry())
      }
    })
    radius = radius + 1 // 调整闪烁速度
    // 请求地图渲染（在下一个动画帧处）
    map.render()
  })
}

export function removehighlightLayer(map) {
  // 设置图层
  if (highlightLayer != null) {
    map.removeLayer(highlightLayer)
  }
}

/**
 * 根据不同类型生成点位图片
 * @param {string} type 点位类型
 * @param {number} data 数据
 */
function _getText(data, type) {
  let text
  // 水环境
  if (type === 'WATER') {
    text = data.quality
  } else if (type === 'AIR') {
    text = data.AQI
  } else if (type === 'cqd') {
    text = '1.503千米'
  }
  return text
}

/**
 * 地图级别中心点
 * @param {Number} lng 经度
 * @param {Number} lat 纬度
 * @param {Object} map 地图对象
 * @param {Number} zoom 层级
 */
export function mapAndCenter(lng, lat, map, zoom) {
  var zhi = lng + ',' + lat
  console.log('zhong', zhi)
  map?.getView().setCenter([Number(lng), Number(lat)]) // 移动
  map?.getView().setZoom(zoom)
}

/**
 * 点击高亮 闪烁
 * @param {Number} lng 经度
 * @param {Number} lat 纬度
 * @param {Object} map 地图
 */
export function heightAndCenter(lng, lat, map, zooms) {
  let timer = ''
  if (zooms && zooms != '') {
    mapAndCenter(lng, lat, map, zooms)
  } else {
    mapAndCenter(lng, lat, map, 8.366)
  }
  // 定时闪烁高亮
  clearTimeout(timer)
  timer = setTimeout(() => {
    let hideTime = ''
    glContent.innerHTML = '<img src="' + img + '">'
    glpup.setPosition([lng, lat])
    glpup.setOffset([-40, -40])
    clearTimeout(hideTime)
    hideTime = setTimeout(() => {
      glContent.innerHTML = ''
      glpup.setPosition(undefined)
    }, 4000)
  }, 500)
}

/**
 * 地图高亮行政区划边界
 * @param {cityName} 城市名称
 */
export function HighlightXZQHPolygon(cityName) {
  if (cityName) {
    dsbjxname = cityName
    if (dsselections != null) {
      dsselections.setVisible(true)
    }
  } else {
    dsbjxname = ''
    if (dsselections != null) {
      dsselections.setVisible(false)
    }
  }
  if (dsselections != null) {
    dsselections.changed()
  }
}

/**
 * 动态服务图层筛选
 * @param {Array} id 图层ID
 * @param {string} condition 查询条件
 * @param {object} map 地图对象
 */
export function searchMapLayer(LayerId, condition, map) {
  const imageParameters = new mapModular.ImageParameters()
  const layerDefs = []
  const idIsArr = Array.isArray(LayerId)
  const idIsArr1 = Array.isArray(condition)
  if (idIsArr && LayerId.length > 1) {
    for (var i in LayerId) {
      idIsArr1 ? (layerDefs[LayerId[i]] = condition[i]) : (layerDefs[LayerId[i]] = condition)
    }
  } else {
    layerDefs[LayerId] = condition
  }
  imageParameters.layerDefinitions = layerDefs
  imageParameters.layerIds = idIsArr ? LayerId : [LayerId]
  imageParameters.layerOption = mapModular.ImageParameters.LAYER_OPTION_SHOW
  imageParameters.dpi = 32
  imageParameters.transparent = true
  const dynamicLayer = new mapModular.ArcGISDynamicMapServiceLayer(MapConfig.MapUrl, {
    imageParameters: imageParameters
  })
  dynamicLayer.id = 'imageLayer'
  dynamicLayer.setVisibleLayers(idIsArr ? LayerId : [LayerId])
  dynamicLayer.refresh()
  map.addLayer(dynamicLayer)
}

/**
 * 根据关键字查询（QueryTask）
 * @param {object} taskParams 查询参数 {layerId,where}
 * @param {function} resolve 回调函数
 */
export function queryTaskByKey(map, jz) {
  const queryTask = `${MapConfig.MapUrl}/1/query`
  const data = {
    f: 'json', where: '1=1', returnGeometry: 'true', spatialRel: 'esriSpatialRelIntersects', outFields: '*'
  }
  axios.get(queryTask, { params: data }).then(res => {
    if (res.status == 200) {
      const result = res.data.features
      // console.log(result)
      result.forEach((v) => {
        DarwPolygon(v, map, jz)
      })
    }
  })
}

/**
 * 绘制区域和边界
 */
export function shengBianjie(map) {
  let isFrist = true
  var data = sheng_bj
  data = data.features[0].geometry.coordinates
  var xinsz = []
  for (var i = 0; i < data.length; i++) {
    xinsz.push(data[i][0])
  }
  xinsz.sort((a, b) => b.length - a.length)
  xinsz.forEach((v) => {
    jiazai(v, isFrist)
    isFrist = false
  })

  function jiazai(datas, isFrist) {
    const features = []
    var feature = new ol.Feature({
      type: 'Polygon', geometry: new ol.geom.Polygon([datas])
    })
    const lineStyle = new ol.style.Style({
      stroke: new ol.style.Stroke({
        color: '#000000', width: 3
      })
    })
    feature.setStyle(lineStyle)
    features.push(feature)
    var bjmian = new ol.layer.Vector({
      zIndex: 3, source: new ol.source.Vector({ features }), xzqh: '河北省'
    })
    map.addLayer(bjmian)
    // bjmian.setVisible(false)
    bianjie.push(bjmian)
  }
}

export function DarwPolygon(queryData, map, jz) {
  let isFrist = true
  // console.log(queryData.geometry.rings)
  queryData.geometry.rings.sort((a, b) => b.length - a.length)
  queryData.geometry.rings.forEach((v) => {
    jiazai(v, isFrist)
    isFrist = false
  })

  function jiazai(data, isFrist) {
    let cityName = ''
    if (queryData.attributes['FIRST_NAME']) {
      cityName = queryData.attributes['FIRST_NAME']
    }
    if (!isFrist && cityName !== '廊坊市') {
      cityName = ''
    }
    // console.log(cityName)
    const features = []
    var feature = new ol.Feature({
      type: 'Polygon', geometry: new ol.geom.Polygon([data])
    })
    const lineStyle = new ol.style.Style({
      stroke: new ol.style.Stroke({
        color: '#000000', width: 3
      })
    })
    feature.setStyle(lineStyle)
    features.push(feature)
    var bjmian = new ol.layer.Vector({
      zIndex: 3, source: new ol.source.Vector({ features }), xzqh: cityName
    })
    map.addLayer(bjmian)
    if (jz && jz == 'no') {
      bjmian.setVisible(false)
    }
    bianjie.push(bjmian)
    // 高亮图层
    const highlightfeatures = []
    var highlightfeature = new ol.Feature({
      type: 'Polygon', geometry: new ol.geom.Polygon([data])
    })
    const highlightlineStyle = new ol.style.Style({
      stroke: new ol.style.Stroke({
        color: 'rgba(255,255,240,1)', width: 3
      })
    })
    highlightfeature.setStyle(highlightlineStyle)
    highlightfeatures.push(highlightfeature)
    var highlightvectorLayer = new ol.layer.Vector({
      zIndex: 2, source: new ol.source.Vector({ features: highlightfeatures }), visible: false
    })
    highlightvectorLayer.set('cityName', cityName)
    map.addLayer(highlightvectorLayer)
    highlightXzqh.push(highlightvectorLayer)
  }
}

/**
 * 时间轴
 * changeMapTimeIndex Function 把改变后的时间点index传回 不传则为 undefined
 * timeIndex Number 传递过来的时间点index  不传则为 undefined
 */
export function playTimer(selfs, map, timeList, pointList, timeType, mapPopRef, mapPopType, dbsszref, changeMapTimeIndex, timeIndex) {
  const timeSliderDiv = document.getElementById('progressTime')
  if (timeList.length > 1 && pointList.length > 1) {
    selfs.getTimexx({
      container: 'progressTime',
      endTime: timeList.length - 1,
      currentTime: timeList.length - 1,
      delay: 2000,
      types: timeType,
      data: timeList,
      callback: function(config) {
        // console.log(config.currentTime);
        dianjia(config.currentTime)
      }
    })
  } else {
    if (timeList.length != 0 && pointList.length != 0) {
      var index = 0
      addPoint(map, pointList[0], 'WATER')
      pointList[index].mapPopType = mapPopType
      // 清除监听
      if (pointListListener) {
        ol.Observable.unByKey(pointListListener)
      }
      // 点位点击事件
      pointListListener = map.on('click', function(evt) {
        var feature = map.forEachFeatureAtPixel(evt.pixel, function(feature) {
          return feature
        }, { hitTolerance: 10 })
        closeInfoWin()
        if (feature) {
          const res = feature.getProperties()
          if (res.type == 'pointlist') {
            const item = res.item
            if (dbsszref) {
              mapPopRef.mapsz = dbsszref.sectionActive
            }
            mapPopRef.mapPopDialog = true
            mapPopRef.mapPopInfo = item
            mapPopRef.mapPopType = mapPopType
          }
        }
      })
    } else {
      addPoint(map, [], 'WATER')
    }
  }

  function dianjia(index) {
    if (mapPopType === 'dhcDbyys') {
      pointList[index].forEach(item => item.mapPopType = 'dhcDbyys')
      addPoint(map, pointList[index], 'WATER')
    } else {
      addPoint(map, pointList[index], 'WATER')
    }
    pointList[index].mapPopType = mapPopType
    // 清除监听
    if (pointListListener) {
      ol.Observable.unByKey(pointListListener)
    }
    // 点位点击事件
    pointListListener = map.on('click', function(evt) {
      var feature = map.forEachFeatureAtPixel(evt.pixel, function(feature) {
        return feature
      }, { hitTolerance: 10 })
      closeInfoWin()
      if (feature) {
        const res = feature.getProperties()
        if (res.type == 'pointlist') {
          const item = res.item
          if (dbsszref) {
            mapPopRef.mapsz = dbsszref.sectionActive
          }
          mapPopRef.mapPopDialog = true
          mapPopRef.mapPopInfo = item
          mapPopRef.mapPopType = mapPopType
        }
      }
    })
  }
}

/* 获取图层信息*/
export function getLayerByName(map, layername) {
  const jihe = []
  if (map != null) {
    const layers = map.getLayers().getArray()
    for (const layer of layers) {
      var name = layer.getProperties()
      if (name.properties == layername) {
        jihe.push(layer)
      }
    }
  }
  return jihe
}

/* 删除图层信息*/
export function removeLayerByName(map, layername) {
  if (map != null) {
    const layers = map.getLayers().getArray()
    for (const layer of layers) {
      var name = layer.getProperties()
      if (name.properties == layername) {
        map.removeLayer(layer)
      }
    }
  }
}

/* 清空图层*/
export function qingkongtu(map) {
  if (yintuceng != null) {
    map.removeLayer(yintuceng)
  }
  if (shituceng != null) {
    map.removeLayer(shituceng)
  }
  if (pointtuceng != null) {
    map.removeLayer(pointtuceng)
  }
}
